将点击事件应用于除单个元素之外的所有元素

Question

我想将点击事件应用于 Javascript 中的整个页面，除了顶部的单个横幅之外的所有内容。假设我不希望事件出现的横幅的 ID 为 'bannerID'。我尝试执行以下操作：

document.onclick = function(){clickEvent()}

document.getElementById("bannerID").onclick = function(){return false;}

但是，文档事件似乎覆盖了所有内容。有人有什么建议吗？

Answer 1

检查处理程序中的元素 ID，例如；

document.onclick = clickEvent;

function clickEvent(e) {
 var from = e.target || e.srcElement;
 if (from.id === 'bannerID') { return; }
 /* ... the handling continues ... */
}

这叫做event delegation

Answer 2

向回调传入一个event参数，检查id是否为'bannerID'

document.onclick = 
    function(event){
        if(event.target.id != 'bannerID'){
            clickEvent()
        }
    };

demo

Answer 3

在上面的代码中，您向 "bannerID" 添加了两个点击事件 - 因此它将执行 clickEvent() 和 return false。

但是，您可以从 onclick 函数中排除特定元素。这可能有帮助：

document.onclick = function(e) {
  if (e.target.id === 'bannerID') {
    return false;
  } else {
    clickEvent();
  }
};

将点击事件应用于除单个元素之外的所有元素

Apply a click event to everything but a single element

html

javascript

events