Question

如果鼠标点击的是div以外的区域,如何让div hidden??

Answer 1

要监听每一个点击事件来确认是否为此 div，若不是则隐藏。

<script type="text/javascript">
window.onload = function() {
document.onclick = function(e) {
var ele = e ? e.target : window.event.srcElement;
if(ele.id !== 'the_div') {
document.getElementById('the_div').style.display = 'none';

// 以下为测试代码，可删除
alert('一秒后 div 恢复');
setTimeout(function() {
document.getElementById('the_div').style.display = 'block';
}, 1000);
// 结束测试代码
}
};
};
</script>

<div id="the_div" style="width: 100px; height: 100px; background: #f00;"></div>

<!-- 以下为测试代码，可删除 -->
<p>p</p>
<p>p</p>
<p><a href="#">link</a></p>
<p>p</p>
<input type="text" />
<!-- 结束测试代码 -->

Answer 2

<div id="id1">现在能看到我</div>
<div onclick="getElementById('id1').style.display='none'">点击我上面就看不到了哦！</div>

Answer 3

直接一代码的形式展示，如果点击div元素以外的区域触发事件则如下代码：
jQuery(document).on(‘click’,function(e){
                                            var e = e || window.event;
                                            var idValue = jQuery(e.target).attr(“id”);
                                            if(idValue == “popup_login”){  //如果是的相等了就执行内容了。
                                                        jQuery(“#popup_login”).remove();
                                 }
       });
如果想了解详情去sky8g网观看，希望对你有帮助！

Answer 4

用javascript