如何使元素在任何事件和所有事件上触发函数?

时间:2012-02-13 07:38:25

标签: javascript javascript-events event-handling

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

在我的脑海中,理想的做法是:

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

而不是:

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

1 个答案:

答案 0 :(得分:0)

我通过研究找到的最好方法是为同一个元素上的每个事件创建一个事件监听器,如下所示:

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);