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

Question

场景如下：我有一组按钮，我想在单击它们时将其绑定到相应的功能。 这些按钮的 id 与其对应功能的名称相同。 我可以这样做：

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

但我很懒，并且想更懒地这样做（这是我的本性）。 由于按钮全部包含在块元素中，我想做这样的事情：

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

但那不起作用。 有什么建议么？

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

Answer 2

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

Answer 3

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

Answer 4

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

为什么不将所有按钮都绑定到一个函数并在事件时根据 this.id 做出决定？

Answer 5

很简单！
您尝试将无功能传递给 click 方法。

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

你需要传递一个函数:

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

});

或者 ：

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