如何使用JavaScript更改<a> tag&#39;s onclick event handler to a function with parameters?</a>

Question

我知道你可以像这样设置一个onclick处理程序：

my_a = document.createElement('a');
my_a.onclick = somefunction;

...但是如果某个功能需要参数怎么办？为简单起见，假设我需要将字符串“x”传递给它。是否可以动态地将onclick处理程序设置为某个函数（'x'）？

Answer 1

您想使用所谓的匿名函数：

my_a.onclick = function() {
    somefunction(arguments, here);
};

如果您想保留“此”，可以utilize closures：

my_a.onclick = function() {
    somefunction.call(my_a, arguments, here);
};

Answer 2

然后你会创建一个匿名函数：

my_a = document.createElement('a');
my_a.onclick = function() { somefunction(x); };

如果您还想参考this中的somefunction，您可以使用像[Prototype] [1]这样的库，那么您可以执行以下操作：

my_a = document.createElement('a');
my_a.onclick = somefunction.bind(this, x);

[1]：http://alternateidea.com/blog/articles/2007/7/18/javascript-scope-and-binding博客文章

Answer 3

您想要的是部分功能应用：

function partial(func /*, 0..n args */) {
  var args = Array.prototype.slice.call(arguments).splice(1);
  return function() {
    var allArguments = args.concat(Array.prototype.slice.call(arguments));
    return func.apply(this, allArguments);
  };
}

现在，您将能够这样做：

my_a.onclick = partial(somefunction,1,2,3); //1,2,3 being some parameters

Answer 4

最简单的方法是将其包装在匿名函数中。像这样：

my_a.onclick = function() { somefunction('x'); };

缺点是“this”将不再引用someFunction函数内部的“my_a”，但如果你不需要它，那么匿名函数应该可以工作。