【问题标题】:Single Event Handler for all events javascript/jQuery所有事件的单个事件处理程序 javascript/jQuery
【发布时间】:2012-12-24 19:18:20
【问题描述】:

我知道我可以让一个处理程序使用 jQuery 处理多个事件,例如:

$('#myID').bind('blur mousedown mouseup focus', function (e) {}

另外,我可以使用 jQuery 从所有元素中注册一个事件,例如:

$(document).on("click", "*", function(event) {
    console.log("Click");
});

我有两个问题:

  1. 如何在纯 JavaScript 中为多个事件注册一个监听器?

  2. 有没有办法使用 JS 或 jQuery 为文档中的所有事件提供一个处理程序,例如将事件委托给我的其他处理程序的主处理程序?

我在看这样的东西:

$(document).on("*", "*", function(event) {
    console.log("I am the master handler...");
    // call delegates
});

【问题讨论】:

标签: javascript jquery html events


【解决方案1】:

这是我可以通过 javascript 获得的最接近的:JSBIN-Demo

<input type="text" id="myText" />


var allEvents = ['focus','blur','mouseover','mousedown','mouseup','mousemove', 'click'];

function masterHandler(){
    var event = event || window.event;
    switch(event.type){
        case 'click':
            console.log('cliked');
            break;
        case 'mouseover':
            console.log('mouseover');
            break;
    }
}

function bindAllEvents(selector, handler) {
    var elements = document.querySelectorAll(selector);
    for(var i=0;i<elements.length;i++){
        for (var key in allEvents){
            elements[i].addEventListener(allEvents[key], handler, false);
        }
    }
}

bindAllEvents('*', masterHandler);

【讨论】:

  • 如果我只需要用户事件,这有点工作。但我也想掌握窗口事件,比如窗口调整大小和滚动。我正在查看 jquery 中已有的东西。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2012-09-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-09-10
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多