我有一个 DIV
元素,它会在执行特定操作时出现。为了简单起见,我编写了一个非常简单的例程来模拟我遇到的问题。然而,我面临的问题是,当您在 DIV
元素内部(以及在 textarea
外部)单击时,它会隐藏 DIV
无论如何。
下面是代码:
<body>
outside div
<br><br>
<a href="#" id="wrap_on">make inside appear</a>
<br><br>
<div id='wrap' style='background:red;display:none;padding:10px;width:155px'>
<textarea id='inside'>inside div</textarea>
<div id='inside2'>also inside div -- click me</div>
</div>
</body>
<script>
$(document).ready(function() {
$('#wrap_on').click(function() {
$('#wrap').show();
$('#inside').select().focus();
});
$('#inside2').click(function() {
alert('test');
});
// #inside2 does not work but #wrap does hide
$('#wrap').focusout(function() {
$('#wrap').hide();
});
});
</script>
或者您可以在这里修改它:http://jsfiddle.net/hQjCc/
基本上,我希望能够单击文本“also inside div -- click me”并弹出警报。但是,.focusout
函数阻止它工作。此外,如果您在其外部单击,我想隐藏 #wrap DIV
。
最佳答案
$(document).click(function(e) {
var t = (e.target)
if(t!= $("#inside").get(0) && t!=$("#inside2").get(0) && t!=$("#wrap_on").get(0) ) {
$("#wrap").hide();
}
});
毕竟这应该可以工作。
关于javascript - jQuery - 如何仅在单击外部时隐藏 DIV 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4912647/