我在DIV里有一个下拉菜单。
我希望下拉菜单是隐藏的,当用户点击任何其他地方。
$('div').blur(function() { $(this).hide(); }
不起作用。
我知道.blur只适用于<a>
,但在这种情况下,最简单的解决方案是什么?
发布于 2009-08-11 11:24:58
我认为问题在于div不会触发onfocusout
事件。您需要捕获主体上的单击事件,然后确定目标是否为menu div。如果不是,那么用户已经在其他地方单击了,并且需要隐藏div。
<head>
<script>
$(document).ready(function(){
$("body").click(function(e) {
if(e.target.id !== 'menu'){
$("#menu").hide();
}
});
});
</script>
<style>#menu { display: none; }</style>
</head>
<body>
<div id="menu_button" onclick="$('#menu').show();">Menu....</div>
<div id="menu"> <!-- Menu options here --> </div>
<p>Other stuff</p>
</body>
发布于 2011-07-28 21:40:39
尝试在div上使用tabindex属性,请参见:
有关更多信息和演示,请查看this帖子。
发布于 2009-08-20 13:32:46
$("body").click(function (evt) {
var target = evt.target;
if(target.id !== 'menuContainer'){
$(".menu").hide();
}
});
给div一个id,例如"menuContainer“。然后你可以通过target.id而不是target.tagName来检查,以确保它是特定的div。
https://stackoverflow.com/questions/1259716
复制相似问题