js点击页面其它地方将某个显示的DIV隐藏


你可以使用JavaScript来监听整个文档的点击事件,并检查点击是否发生在特定的DIV外部。如果是,则隐藏该DIV。以下是一个简单的实现方法:


// 假设你的DIV有一个特定的ID,例如 'myDiv'
var myDiv = document.getElementById('myDiv');

// 监听整个文档的点击事件
document.addEventListener('click', function(event) {
    // 检查点击事件的目标(或冒泡的父元素)是否是myDiv或其子元素
    if (!myDiv.contains(event.target)) {
        // 如果不是,则隐藏myDiv
        myDiv.style.display = 'none';
    }
});

这段代码首先获取了ID为`myDiv`的DOM元素。然后,它给整个文档添加了一个点击事件监听器。在监听器的回调函数中,使用`event.target`来获取触发点击事件的元素。`myDiv.contains(event.target)`用于检查这个元素是否是`myDiv`或其子元素。如果不是,就通过修改`myDiv`的`style.display`属性来隐藏它。

这种方法简单且高效,适用于大多数需要点击外部元素来隐藏特定DIV的场景。