如何使元素触发任何和所有事件的功能？答案

【问题标题】：How can I make an element trigger a function on any, and all events?如何使元素触发任何和所有事件的功能？
【发布时间】：2012-02-13 07:38:24
【问题描述】：

我认为对我的特定场景的解释在这里不会有太大帮助。所以简而言之，我需要知道如何在任何和所有事件上调用函数。想法是无论特定元素发生什么事件，都调用相同的函数。

在我看来，理想的方法是这样的：

<div onAnyEvent="function()"></div>

而不是：

<div onClick="function()" onMouseover="function()" onKeypress="function()"></div>

【问题讨论】：

你想在 pur JS 或 jquery 中也可以这样做？？？
我想用纯 JS 来做。感谢您的提问。
类似问题stackoverflow.com/questions/5123356/…希望对您有所帮助....
这正是我想要做的，除了没有 jquery 部分。 :-)

标签： javascript javascript-events event-handling

【解决方案1】：

我通过研究发现的最佳方法是为同一元素上的每个事件创建一个事件侦听器，如下所示：

window.onload = addListeners;

function addListeners(){
  if(window.addEventListener){
    document.getElementById('message').addEventListener('keydown',textarea_resize,false);
    document.getElementById('message').addEventListener('keyup',textarea_resize,false);
    document.getElementById('message').addEventListener('keypress',textarea_resize,false);
}

再解释一下：

addEventListener('event to listen to', function_to_be_called, useCapture-value)

第一个参数是您要监听的事件（即'click' 或'keydown'）。

第二个是你要调用的函数：（即validate_form）。

-你也可以将参数发送到函数中：validate_form(e, i)。

对于大多数用途，使用捕获的最后一个值通常设置为false，如果您不指定任何值，false 是自动值。进一步解释可以获取here！

所以一个完整的例子可能是：document.getElementById('message').addEventListener('keydown',textarea_resize,false);，正如我上面展示的那样。

【讨论】：