0

我正在构建我的第一个简单的手风琴类型的东西(没有任何网络 tuts),我拥有的 js 是这样的:

jQuery(document).ready(function($){

    $('#one').css("height", "25");
    $('#dtwo').css("height", "25"); 
    $('#three').css("height", "25");   
        $('#one').click(function() {
          if ($('#one').hasClass("extended")) {
            $('#one').animate({height: '25px'},500);
            $('#one').removeClass("extended");
            $('#a1').animate({opacity: '1'},500);
          } else {
            $('#one').animate({height: '120px'},500);
            $('#one').addClass("extended");
            $('#a1').animate({opacity: '0'},300);
          }
    });
});

哪个工作正常。

但是,您可以单击它 200 次,它会执行 200 次,我该如何防止这种情况?

4

2 回答 2

3

如果你在谈论动画排队,你可以使用stop()方法。像这样的东西:

$('#a1').stop(true).animate({opacity: '1'},500);

true作为第一个参数传递将清除队列。

clearQueue一个布尔值,指示是否也删除排队的动画。默认为假。

如果由于 clearQueue 布尔值导致动画中途停止时遇到问题,您可以尝试stop(true, true)改用。

jumpToEnd一个布尔值,指示是否立即完成当前动画。默认为假。

于 2012-10-25T11:13:00.633 回答
0

尝试以下方法(未经测试,但您大致了解):

if ($('#one').hasClass("extended")) {
        if ($('#one').data("inProgress")) return;
        $('#one').data("inProgress", true);
        $('#one').animate({height: '25px'},500);
        $('#one').removeClass("extended");
        $('#a1').animate({opacity: '1'},500);
        $('#one').data("inProgress", false);
      } else {
        if ($('#one').data("inProgress")) return;
        $('#one').data("inProgress", true);
        $('#one').animate({height: '120px'},500);
        $('#one').addClass("extended");
        $('#a1').animate({opacity: '0'},300);
        $('#one').data("inProgress", false);
      }
于 2012-10-25T11:19:17.517 回答