Jquery 如果用户在设置动画时单击鼠标，则防止单击触发器

我有一个

.box

div，点击它就会展开

问题是，如果在该div上多次快速单击，单击事件将触发新动画，并且动画将在每次单击时运行

HTML

<div class="box">
    <div class="title">
        <label>Some title</label>
    </div>
    <div class="text">
        <label>Some text that is longer then the title text</label>
    </div>
</div>

我想以某种方式禁用单击，直到动画完成一次

可能吗

.

使用

.is（':animated'）

检查对象当前是否已设置动画，例如：

使用

.is（':animated'）

检查对象当前是否已设置动画，例如：

---

您应该绑定到click事件处理程序，而不是使用toggle，因为它在jQuery 1.8中已被弃用，并在jQuery 1.9中被删除

$('.box').click(function() {
    var $this = $(this);
    if($this.is(':animated')){
        return false;   // return false if it's already animating
    }
    // determine height/width to animate too
    var height = $this.height() == 529 ? '163px': '529px';
    var width = $this.width() == 460 ? '200px' : '460px';

    $this.attr("selected", "true");
    $this.animate({"height": height, "width": width}, "slow");
});

---

您应该绑定到click事件处理程序，而不是使用toggle，因为它在jQuery 1.8中已被弃用，并在jQuery 1.9中被删除

$('.box').click(function() {
    var $this = $(this);
    if($this.is(':animated')){
        return false;   // return false if it's already animating
    }
    // determine height/width to animate too
    var height = $this.height() == 529 ? '163px': '529px';
    var width = $this.width() == 460 ? '200px' : '460px';

    $this.attr("selected", "true");
    $this.animate({"height": height, "width": width}, "slow");
});

---

供参考。。切换事件处理程序在jQuery 1.8中已被弃用，并在jQuery 1.9@wirey中删除。切换的替代方法是什么？切换只绑定到单击事件-因此您可以绑定到单击事件手动处理程序，以供参考。。切换事件处理程序在jQuery 1.8中已被弃用，并在jQuery 1.9@wirey中删除。切换的替代方法是什么？切换只绑定到单击事件-因此您可以绑定到单击事件手动处理程序

$('.box').click(function() {
    var $this = $(this);
    if($this.is(':animated')){
        return false;   // return false if it's already animating
    }
    // determine height/width to animate too
    var height = $this.height() == 529 ? '163px': '529px';
    var width = $this.width() == 460 ? '200px' : '460px';

    $this.attr("selected", "true");
    $this.animate({"height": height, "width": width}, "slow");
});