我有一个简单的div结构(见下文).我想要做的就是当点击div“面试者 – 按钮”时,下面的div应该出现,当div id“elt”被点击时,id为“parent0”,直到结尾应该隐藏.
显示部分工作正常.但是,当我试图隐藏时,它只是不隐藏.当我点击div“elt”时,警告消息“hh”(见下文)被抛出!!奇怪的.有关如何隐藏这个的任何帮助?
<div id = "interviewer-Button"> Interviewer <div id = "parent0"> Viv <div id = "parent1"> Parent <div id = "elt"> Close </div> </div> </div> </div> <script> $(document).ready(function() { $("#parent0").hide(); $("#interviewer-Button").click(function() { alert("hh");$("#parent0").show(); }); $("#elt").click( function () { $(this).parent().parent().hide(); }); }); </script>
解决方法
您需要停止在内部元素的处理程序中传播click事件.如果没有它,也将调用父代的处理程序.有关详细信息,请参阅
jQuery event object.
$("#elt").click( function (e) { e.stopPropagation(); $(this).parent().parent().hide(); });