防止多次点击发起动画

我有一个div框，如果我双击将展开到整个页面。如果我按下div展开后生成的按钮，则div框会最小化为原始大小。但是，如果我双击div框，该事件将被触发两次，展开div框然后立即将其最小化。所以我尝试使用.one（），但没有意识到它只能工作一次。我可以使用什么来只允许一次点击而不触发多个事件？这里是jsbin，下面是严格的jQuery代码。 http://jsbin.com/eqezas/3/edit 防止多次点击发起动画

$("#block").one('click', function(){ 
      $('#block1').hide(); 
    $("#block").animate({ 
    width: "100%", 
    height: "100%", 
    opacity: 0.4, 
    fontSize: "3em", 

    }, 1500, function() { 
    $('#but').show(); 
    }); 


}); 


$('#but').one('click',function() { 
      $('#block1').show(); 
     $("#block").animate({ 
    width: "100px", 
    height: "40px", 
    opacity: 1, 
    fontSize: "1em", 

    }, 1500); 
      $('#but').hide(); 
    return false; 

});

来源

2012-09-27 jason328

尝试是这样的：

var processing = false; // Global variable 

// Probably in document.ready: 
$("#element").click(function() { 
    if (!processing) { 
     processing = true; 
     $("#element2").animate({"blah": "blah"}, 1000, "easeOutBounce", function() { 
      processing = false; 
     }); 
    } 
});

这样一来，无论你点击原始元素这么多次，这是在“处理”状态，直到动画完成。

来源

2012-09-27 05:57:26 Ian

即使我将one（）更改为on（）并使用您的代码，该效果也只能使用一次。虽然多个事件被阻止！ – jason328

我没有看到您的原始代码发生“双击”问题。我发现它不会允许最大化/最小化发生多次（因为“one”）。但我不知道实际问题是什么。您需要使用某种标志，例如我建议的全局布尔值，让程序知道它正在被最大化（或最小化），并且在这些时间段内的任何点击都应该被忽略（但您仍然应该“返回false;'为最小化按钮无论如何）。 – Ian

如果我用.on（）替换.one（），然后双击最小化按钮，那么效果就会发生。我会再玩一些。 – jason328

防止多次点击发起动画

回答

相关问题