将所有可用事件绑定到元素

can I bind all the available events to an element

我可以将所有可用事件绑定到元素

$('body').on('all available events', '.element', function(e) {
  if (e.type == 'click') {
    // do something...
  } 
  else if (e.type == 'change') {  
    // do something else...
  }
});

I do not want to give them individually like

我不想单独给他们

$('body').on("change click", '.element', function(e) {...});

3 个解决方案

#1

I'll not recommend you to do that, but if you want to:

我不建议你这样做，但如果你想：

$('body').on('blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error contextmenu', function(e) {
    // Your code here
});

Reference: https://github.com/jquery/jquery/blob/master/src/event/alias.js#L6

参考：https：//github.com/jquery/jquery/blob/master/src/event/alias.js#L6

#2

Seems like a bad idea, but you could get all the available event on an element by running Object.keys on it, and filtering out everything that starts with on....

看起来好像一个坏主意，但你可以通过运行Object.keys来获取元素上的所有可用事件，并过滤掉以...开头的所有内容。

To pass it to jQuery, the on... part has to be removed as well

要将它传递给jQuery，还必须删除on ...部分

var props = Object.keys(document.body).filter(function(x) {
    return x.indexOf('on') === 0;
}).map(function(x) {
    return x.replace('on','');
}).join(" ");

$('body').on(props, '.element', function(e) {
    console.log(e.type)
});

FIDDLE

小提琴

In my browser that would bind the event handler to

在我的浏览器中将事件处理程序绑定到

unload
storage
popstate
pageshow
pagehide
online
offline
message
languagechange
hashchange
beforeunload
scroll
resize
load
focus
error
blur
autocompleteerror
autocomplete
waiting
volumechange
toggle
timeupdate
suspend
submit
stalled
show
select
seeking
seeked
reset
ratechange
progress
playing
play
pause
mousewheel
mouseup
mouseover
mouseout
mousemove
mouseleave
mouseenter
mousedown
loadstart
loadedmetadata
loadeddata
keyup
keypress
keydown
invalid
input
ended
emptied
durationchange
drop
dragstart
dragover
dragleave
dragenter
dragend
drag
dblclick
cuechange
contextmenu
close
click
change
canplaythrough
canplay
cancel
abort
webkitfullscreenerror
webkitfullscreenchange
wheel
selectstart
search
paste
cut
copy
beforepaste
beforecut
beforecopy

卸载存储popstate pageshow pagehide在线离线消息语言更改hashchange beforeunload滚动调整大小加载焦点错误模糊autocompleteerror自动完成等待volumechange切换timeupdate暂停提交停止显示选择寻求重置率更改进度播放暂停mousewheel mouseup mouseout mouseout mousemove mouseleave mouseenter mousedown loadstart loadedmetadata loadeddata keyup keypress keyydown无效输入结束清空持续时间变化下降dragstart dragover dragleave dragenter dragend drag dblclick cuechange contextmenu关闭点击更改canplaythrough canplay取消中止webkitfullscreenerror webkitfullscreenchange wheel selectstart搜索粘贴剪切复制beforepaste beforecutcopycopy

#3

You should not bind all events to your handler, because you don't know what "all" is, thus it is bad practice for almost all applications. Also, you cannot bind to all events, because addEventListener which is used internally in jQuery requires you to state the type to listen to. Even if you have a list of "all" events, there can still be custom events defined which have their own arbitrary names.

您不应该将所有事件绑定到您的处理程序，因为您不知道“all”是什么，因此对于几乎所有应用程序来说都是不好的做法。此外，您无法绑定到所有事件，因为在jQuery内部使用的addEventListener要求您声明要侦听的类型。即使您有“所有”事件列表，仍然可以定义具有自己的任意名称的自定义事件。

#1