如何将参数传递给事件处理程序

这里就是我试图做的，不工作：

for (var i = 0; i < myobj.length; i++) { 
myobj[i].onmouseover = myfun(myobj[i]); 
}

以下不工作也没有。

myobj[i].onmouseover = myfun.call(myobj[i]); 
myobj[i].onmouseover = function() {myfun(myobj[i]);}; 
myobj[i].onmouseover = function() {myfun.call(myobj[i]);};

我主要感兴趣的是它为什么不起作用，并且解决方法相同。

谢谢。

来源

2012-04-25 Xah Lee

只需使用创建者函数为您的处理程序封装要传递的参数即可。

function createHandler(param) { 
    return function() { 
    myfun(param); 
    } 
} 

for (var i = 0; i < myobj.length; i++) { 
    myobj[i].onmouseover = createHandler(myobj[i]); 
}

您的方法不起作用的原因是，因为您不传递函数引用，而是传递函数的结果。因此，在您的第一个示例中，将评估myfun(myobj[i])并将结果作为事件处理程序传递。

我认为，你的真正意思是，如果事件被解雇，应评估功能。要做到这一点，你必须通过一些全局变量或作为dataset property来传递参数。

但是，更清洁的解决方案是具有如上所示的发电机功能。

来源

2012-04-25 12:18:50 Sirko

非常感谢。正是我需要的。 – 2012-04-25 12:43:55

PS跟进问题。我在做什么好，有没有一种惯用的方式来做到这一点？基本上我有一堆span.xyz元素，我希望他们都有一个鼠标悬停行为。（但不使用JQuery或任何其他） – 2012-04-25 12:46:04

@XahLee只要你没有使用任何库，我认为这就是最好的选择。 – Sirko 2012-04-25 12:48:56

另一种方法是使用事件onmouseover将作为方法（不是函数）在引发事件的DOM元素上调用。

换句话说，写你的代码，如果你希望别人这样做：

obj = xahlees(); 
obj.onmouseover();

这里有一个解决方案：

for (var i = 0; i < myobj.length; i++) { 
    myobj[i].onmouseover = function() { myFun(this) }; 
}

我已经上传了more complete example。

来源

2012-04-25 13:24:49 Leonel

有点晚，但这也是一个很好的解决方案。谢谢莱昂内尔。 – 2013-12-14 06:27:03

如何将参数传递给事件处理程序

回答

相关问题