使用jQuery将函数惰性绑定到多个事件

Question

以下是情景：我有一组按钮，当点击时我想要将其绑定到相应的函数。这些按钮的id与它们对应函数的名称相同。我可以这样做：

$("#kick").click(kick);
$("#push").click(push);
$("#shove").click(shove);

但是我很懒，希望以一种更懒的方式完成这个任务（因为这就是我的天性）。由于所有按钮都包含在一个块级元素中，我想要做的是：

$("#button_holder > span").each(function () {
    var doThis = this.id;
    $(this).click(doThis);
});

除了那个方法不起作用。有什么建议吗？

- robbiebow

Answer 1

和其他回答者一样，我不确定这是否是“真正”的懒惰（作为程序员的美德），但只有您知道您的实现细节。

如果您确实想要做类似于此的事情，可以使用对象来存储特定的函数，然后使用字符串来查找它们：

var myFunction = {
     kick:  kick,
     push:  push,
     shove: shove
};

$("#button_holder > span").each(function () {
    var doThis = this.id;
    $(this).click(myFunction[doThis]);
});

或者使用匿名函数：

var myFunction = {
     kick:  function() { /*do kick  */ },
     push:  function() { /*do push  */ },
     shove: function() { /*do shove */ }
};

$("#button_holder > span").each(function () {
    var doThis = this.id;
    $(this).click(myFunction[doThis]);
});

- Adam Bellaire

---

谢谢你的建议，两种方法都对我有用。我认为这是适当的懒惰，因为它减少了我需要添加新按钮和相关事件的重复/工作量，但当然，这是可以争论的。再次感谢。 - robbiebow

Answer 2

我想我不明白这样做的意义。无论如何，您都需要单独创建每个函数，而这种编程通常很难让其他人理解。也许如果您有数十个按钮并且这是一次性代码，我可以理解，但..可能不会...

为什么不只将所有内容绑定到一个函数，并根据事件时间基于this.id进行确定呢？

- Scott Evernden

---

我认为更易读和更可重用的做法是说“这个 div 的子 span 都将有自己的函数，而这些函数的名称将与 span 的 id 相同”。这只是审美问题，我个人观点。 - robbiebow

Answer 3

$("#button_holder > span").each(function () {
    var doThis = this.id;
    $(this).click(function(doThis){
      alert(doThis);
    });
});

- Moran

---

我认为那样行不通；它将一个匿名函数绑定到事件上。 - robbiebow

Answer 4

<input type="submit" id="kick" value="Kick Me">
<input type="submit" id="push" value="Push Me">

<script type="text/javascript>
$(function() {
    $("input[type=submit]").each(function () {
        var doThis = this.id;
        $(this).click(doThis);
    });
});
</script>

- Burak Erdem

---

这给了我相同的最终结果，只是选择要绑定的元素的方式已经改变，就我所看到的。 - robbiebow

Answer 5

非常简单！你试图将非函数传递给click方法。

var doThis = this.id;
$(this).click(doThis);

你需要传递一个函数：

 $(this).click(function(doThis){
      alert(doThis);

});

或者:

function myFunc(){};
$(this).click(myFunc);

- Moran