我在这里看过类似的问题，但没有一个能真正帮助我解决问题。
所以我的设置是这样的:
<body>
...some code
<button id="button" onClick="showPopup()">click me!</button>
<div id="popup">
...stuff
</div>
..some more code
</body>
对于我的CSS我有
#popup{
z-index:2;
...other styling
}
而其他一切都是 z-index 1
和javascript
$("#popup").hide(); //default
function showPopup(){
$("#popup").show();
}
我希望弹出窗口在单击按钮时显示，并在单击其他任何地方时隐藏。
$(document).click(function (e){$("#popup").hide();}
这是行不通的，因为弹出窗口是文档的一部分，所以当单击按钮时，它会立即显示然后隐藏。 我还尝试添加类并隐藏 if hasClass 但没有用。 z-index 的不同也与此有关吗？
最佳答案
删除内联事件处理程序并执行
$("#popup").hide();
$(document).on('click', function(e) {
if ( $(e.target).closest('#button, #popup').length ) {
$('#popup').show();
} else if ( $('#popup').is(':visible') ) {
$('#popup').hide();
}
});
关于javascript - 单击一个按钮显示，其他地方隐藏，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27929615/