1

When I assign the event handler without parameters, it works: http://jsfiddle.net/mUj43/

function show(){
    alert('work');
}

var myButton = document.createElement("input");  
myButton.type="button";  
myButton.value="click";   
myButton.onclick=show;

var where = document.getElementById("where");
where.appendChild(myButton);  ​

but if I pass parameters, it doesn't work: http://jsfiddle.net/mUj43/1/

myButton.onclick = show('test');

How can I use function with parameters in dynamically created elements?

4

4 回答 4

7

你不能这样做，你可以通过创建一个新函数来使用部分应用程序，然后将其附加为事件处理程序：

myButton.onclick=show.bind( myButton, 'test');

http://jsfiddle.net/mUj43/2/

文档（我建议您阅读，因为此功能对许多其他事情也很有用）和兼容性信息：https ://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind

于 2012-08-19T15:07:19.510 回答
3

您必须创建自己的闭包：

myButton.onclick = function () {
    show.call(this, 'test');
};

你也可以使用@Esailija 的bind方法，但是这个方法有更深的浏览器支持。

于 2012-08-19T15:08:41.343 回答
2

尝试：

myButton.onclick = function(){show("test");}

或者 ：

myButton.onclick = function(){ show.call( this, "test");}

如果要在 show 函数中保留元素对象上下文

于 2012-08-19T15:08:28.980 回答
0

那是因为当您添加事件时，您需要一个函数引用。

在您的第一个示例中，show是对函数的引用。

在您的第二个示例中，show('test')是对 function 的调用show，它不返回任何内容，并且 nothing 不是函数引用。

这就是为什么当您加载页面时，它会提示“工作”（调用该函数），但是当您单击按钮时不会调用任何函数。

然后，你需要一个函数。

你可以声明它：

myButton.onclick=f;
function f(){
   show('test')
}

或者您可以使用匿名的：

myButton.onclick=function(){
   show('test')
}
于 2012-08-19T15:15:48.733 回答