单一事件处理程序的所有事件javascript/jQuery

Single Event Handler for all events javascript/jQuery

本文关键字:事件 javascript jQuery 事件处理 程序 单一      更新时间:2023-09-26

我知道我可以使用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的: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);