使用jQuery对多个事件使用懒惰绑定函数

以下是这个场景：我有一组按钮，点击时我想将其绑定到相应的功能。这些按钮的ID与其相应功能的名称相同。我能做到这一点：使用jQuery对多个事件使用懒惰绑定函数

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

但我很懒惰，并希望这样做更懒惰（因为是我的本性）。由于按钮都包含在一个块元素中，我想要这样做：

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

除此之外不起作用。有什么建议么？

来源

2008-12-28 robbiebow

像其他的应答者，我不知道这是“真正的”懒惰（如程序员的美德），但只有你知道你的实现细节。

如果你真的想这样做，你可以使用一个对象来存储你的特定功能，然后使用字符串来看看他们：

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

来源

2008-12-28 15:56:16

谢谢你的想法，这两个都适合我。我认为这是适当的懒惰，因为它减少了我需要做的添加新按钮和相关事件的重复/工作量，但是肯定的是，这是有争议的。再次感谢。 – robbiebow 2008-12-28 16:15:59

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

来源

2008-12-28 15:24:56 Moran

我不认为这是有效的;它将一个匿名函数绑定到事件。 – robbiebow 2008-12-28 15:44:51

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

来源

2008-12-28 15:31:47

这给了我相同的最终结果，就像我看到的那样，选择绑定元素的方式已经改变。 – robbiebow 2008-12-28 15:46:31

我想我没有看到这一点。无论如何，你需要分别创建每个功能，而这种编程对其他人来说通常很困难。也许如果你有几十个按钮，并且它是一次性代码，我可以理解但是..可能不是...

为什么不把所有的东西都绑定到一个函数，并根据this.id在事件时间做出决定??

来源

2008-12-28 15:35:51

我发现它更具可读性，更具可重用性，可以说“这个div的子跨度都将有自己的功能，并且这些功能的名称将与跨度的id相同。这是IMO的美学问题。 – robbiebow 2008-12-28 16:19:36

它很简单！您尝试将非函数传递给click方法。

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

你需要传递一个函数：

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

}）;

或：

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

来源

2008-12-28 15:46:02 Moran

使用jQuery对多个事件使用懒惰绑定函数

回答

相关问题