我想在单击除 div 之外的页面正文时隐藏所有 div 的隐藏。
我的 div 是
<div id="settingsBoxExpand">
<div id="settings1" class="settingsBoxExpandItem" style="padding:3px;border-bottom:1px solid #dddddd">My Account</div>
<div id="settings2" class="settingsBoxExpandItem" style="padding:3px;border-bottom:1px solid #dddddd">Preferences</div>
<div id="settings3" class="settingsBoxExpandItem" style="padding:3px;">Logout</div>
</div>
然后单击设置 xBox Expand div 将向下滑动。
我需要在单击设置 xBox Expand div 之外的任何其他位置时隐藏它。
我还有 3 个类似的 div。
尝试过
$('body:not(#settingsBoxExpand)').click(function(){
$("#settingsBoxExpand").hide();
});
但它不起作用。
“不”对我不起作用。
提前致谢。
您需要设置主体（或文档）以隐藏单击框并阻止 div 上的单击事件在 DOM 中冒泡并触发主体单击事件：
$('body').click(function(){
$("#settingsBoxExpand").hide();
});
$('#settingsBoxExpand').click(function(event) {
event.stopPropagation();
});
通过将 .hide() 作为 body 的点击处理程序的一部分，当点击事件在 DOM 中冒泡并到达 body 时，它将隐藏 div。使用 .stopPropagation 可以防止事件到达主体。
事件捕获和冒泡对于理解更高级的事件处理非常重要；如果您有兴趣，这里还有更多阅读内容：
http://www.quirksmode.org/js/events_order.html http://www.quirksmode.org/js/events_order.html
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
