如何为javascript中的所有事件添加事件侦听器而不单独列出它们? [英] How can I add an event listener for all events in javascript without listing them individually?
问题描述
我想使用通配符(我认为不存在?)完成以下代码
I'd like to accomplish the following code using a wildcard (that I don't think exists?)
myObject.element = document.getElementsByClassName('js-myObject');
myObject.element.addEventListener('click', myObject.click);
myObject.element.addEventListener('mouseover', myObject.mouseover);
//etc..
到目前为止,我有以下内容
So far, I have the following
myObject.controller = function(e){
if( (e.type in myObject) && (typeof myObject[e.type] ==='function') ){
myObject[e.type](e);
}
};
//but the listeners still have to be assigned as such
myObject.element = document.getElementsByClassName('js-myObject');
myObject.element.addEventListener('click', myObject.controller);
myObject.element.addEventListener('mouseover', myObject.controller);
//etc...
// but I want to do (and it doesn't work)
myObject.element.addEventListener('*', myObject.controller);
对于事件数组和 foreach 语句以外的方法有什么建议吗?
Any suggestions on methods other than an array of events and a foreach statement?
我已经接受了下面的答案(没有可用的通配符,解析可能有数百个事件是个坏主意)
I've accepted an answer below (there's no wildcard available, and it's a bad idea to parse potentially hundreds of events)
对于那些正在寻找类似功能的人,我已经确定了以下方法,至少目前是这样.
For those looking for a similar function, I've settled on the following approach, at least for now.
for(var prop in myObject){
if (!myObject.hasOwnProperty(prop){continue;}
if (typeof myObject[prop] !== 'function'){continue;}
myObject.element.addEventListener(prop, myObject[prop]);
}
好处是自定义事件的处理程序,我不必返回并为其添加侦听器.缺点是我必须确保在定义每个 myObject.someEvent() 之后调用此函数.我在 myObject.init() 中调用它;这对我来说很好用.请注意,此解决方案不符合我以前的规范,因为它使用了 for/each 循环——但它完成了我真正想要完成的工作,非常感谢 @torazaburo 明确定义了我的技术限制和缺乏智慧初步计划.
The upside is a handler for custom events that I don't have to go back and add listeners for. The downside is that I have to ensure this function is called after every myObject.someEvent() is defined. I call it in myObject.init(); which works for me just fine. Note that this solution wouldn't fit my previous specs, because it uses a for/each loop -- but it accomplishes what i really wanted to accomplish and a big thanks to @torazaburo for clearly defining the technical limitations and lack of wisdom in my initial plan.
推荐答案
没有添加 *
侦听器的功能,我怀疑您是否希望某个元素上的数百个事件被侦听.
There is no feature to add a *
listener, and I doubt if you want hundreds of events on an element being listened for anyway.
顺便说一句,您应该使用涉及EventListener
接口和 handleEvent代码>它定义的方法.
By the way, instead of your roll-your-own architecture for a generic event handler in the form of your myObject.controller
, you should use the under-appreciated approach involving the EventListener
interface and the handleEvent
method it defines.
这篇关于如何为javascript中的所有事件添加事件侦听器而不单独列出它们?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!