jQuery：如何将.blur应用于div的每个*子元素而不是div的任何*子元素？

Question

我正在创建一个Facebook风格的“你在想什么？”切换输入框。我接近它的方式是点击和模糊组合。点击一个输入框会自动展开容器div并显示一些元素。这工作正常。但是，我很难做到这一点，以便当焦点离开容器div的每个子元素时，它将返回它被切换（更小的div和隐藏的子元素）状态。

如果我只是做“＃容器DIV> *”，对于.blur，该.blur将触发任何时候任何子元素失去焦点，而不是在每一个子元素失去焦点（重点是不再在容器div的任何子元素上）。我尝试更改$（“＃create-community> *”）。blur to $（“*”）.not（“＃create-community> *”）。blur，但这不起作用无论是。

有什么建议吗？

$("#create > *").click(function() { 
    $(".expand").addClass("expand-expand"); 
    $(".expand-expand").removeClass("expand"); 
    $("#create").addClass("create-expand"); 
    $("#create").removeClass("create"); 
    $(".write-title").addClass("write-title-expand"); 
    $(".write-title-expand").removeClass("write-title"); 
    $(".summary").addClass("summary-expand"); 
    $(".summary-expand").removeClass("summary"); 
    $(".input").addClass("input-expand"); 
    $(".input-expand").removeClass("input"); 
    $(".submit").addClass("submit-expand"); 
    $(".submit-expand").removeClass("submit"); 
    $(".name").attr("value", ""); 
}); 

$("#create > *").blur(function() { 
    $(".expand-expand").addClass("expand"); 
    $(".expand").removeClass("expand-expand"); 
    $("#create").addClass("create"); 
    $("#create").removeClass("create-expand"); 
    $(".write-title-expand").addClass("write-title"); 
    $(".write-title").removeClass("write-title-expand"); 
    $(".summary-expand").addClass("summary"); 
    $(".summary").removeClass("summary-expand"); 
    $(".input-expand").addClass("input"); 
    $(".input").removeClass("input-expand"); 
    $(".submit-expand").addClass("submit"); 
    $(".submit").removeClass("submit-expand"); 
    $("#name").attr("value", "write something..."); 

}）;

Answer 1

当单个元素失去焦点时，模糊事件将始终触发。你需要做的是检查#create中的单个元素失去焦点时，哪些元素已经聚焦。如果新聚焦的元素不在div中，则可以更改这些类。要做到这一点，你可以简单地检查聚焦元素不是＃创建的子

喜欢的东西

$("#create > *").blur(function() { 
    if($("#create > *:focus").length == 0) { 
     $(".expand-expand").addClass("expand"); 
     $(".expand").removeClass("expand-expand"); 
     $("#create").addClass("create"); 
     $("#create").removeClass("create-expand"); 
     $(".write-title-expand").addClass("write-title"); 
     $(".write-title").removeClass("write-title-expand"); 
     $(".summary-expand").addClass("summary"); 
     $(".summary").removeClass("summary-expand"); 
     $(".input-expand").addClass("input"); 
     $(".input").removeClass("input-expand"); 
     $(".submit-expand").addClass("submit"); 
     $(".submit").removeClass("submit-expand"); 
     $("#name").attr("value", "write something..."); 
    } 
}); 

Answer 2

呀，托比是正确的，你一定要考重点是否跑到外面与否。 顺便说一句，只是带走节点的孩子会更容易，应该也会更快。 “> *”只是提出问题。因此，与启动：

$（ “＃创建”）儿童（）模糊（函数（）{ ... }

。