jquery，乘法选择器和 OR 函数答案

【问题标题】：jquery, multiply selectors and OR functionjquery，乘法选择器和 OR 函数
【发布时间】：2012-10-02 11:45:24
【问题描述】：

大家好，我有这个代码：

$('#riscButton, #eneButton, #giardButton').one("click", function(){
                $('.content').animate(
                    {"height":"+=620px"},
                    500,
                    'easeOutBounce');
                $('#eneButton').animate(
                    { "top":"+=310px"},
                    1500,
                    'easeInOutExpo');
                $('#eneButton').animate(
                    {"left":"-=310px"},
                    1500,
                    'easeOutBounce')
                $('#giardButton').animate(
                    {"top":"+=620px"},
                    2000,
                    'easeInOutExpo')
                });

正如你所看到的，如果有人点击一个按钮，动画就必须发生，你点击哪个按钮并不重要，你有相同的动画。使用 one() 我对必须单击一次的按钮说，这就是问题所在，我怎么能对脚本说如果你按下一个按钮，甚至其他按钮也必须在之后被禁用？现在，例如，如果我单击第一个按钮，动画就发生了，如果我重新单击同一个按钮，什么也没发生，但是如果我单击第二个或第三个按钮，动画就会再次开始。我该如何解决？

【问题讨论】：

标签： jquery function animation click jquery-animate

【解决方案1】：

您必须解除事件与所有元素的绑定，而不仅仅是您单击的元素：

$('#a, #b, #c').click(function() {
    alert('clicked');

    $('#a, #b, #c').off('click');
});

演示：http://jsfiddle.net/peFff/3/

更好的解决方案是使用类：

$('.clickable').click(function() {
    alert('clicked');

    $('.clickable').off('click');
});

演示：http://jsfiddle.net/peFff/5/

【讨论】：

我会这样做，但也要在每个按钮上使用一个类，而不是分别通过它们的每个 ID 来引用它们。
只需为每个按钮指定一个类，例如fiddle
@TomPietrosanti：正如您评论的那样，我将其编辑为我的答案正确。
一定是我们的头脑很好，因为我听说他们的想法很相似 :)

【解决方案2】：

第一次单击时，您可以简单地向容器标记添加一个类，说明单击了一个按钮。在随后的点击中，在调用动画之前检查容器是否具有该类。

【讨论】：

【解决方案3】：

使用选择器。例如：$('#riscButton, #eneButton, #giardButton').attr('disabled','disabled') 在您的函数中。该选择器为您返回一个包含所有按钮的数组... 然后你应该解开按钮......通过$('#riscButton, #eneButton, #giardButton').off('click.button')

将 .button 添加到您的事件名称到 namespace 并使其更容易找到（它还将避免取消绑定不需要的事件处理程序）。

最后一点：最后，如果您必须将 $('#a,#b,#c') 作为选择器，您应该考虑使用类来代替（只是让代码更好看）

【讨论】：