Question

我希望阻止点击元素，同时执行一些动画，然后再启用它。我试图使用unbind然后绑定，但点击仍然永久禁用。还有其他办法吗？

$("something").on("click", function() {
    $("selected").unbind("click");
    $("selected").animate({...}, function() {
        $("selected").unbind("click");
    });

基本上，我不希望有人在动画进行过程中点击所选的div，因为点击它会启动另一组动画，我不想在它们之间启动。

Answer 1

试试这个，如果动画正在发生，使用flag变量来存储信息：

var animating = false;
$("something").on("click", function () {
    animating = true;
    $("selected").animate({...
    }, 1000, function () {
        animating = false;
    });
});
$("selected").click(function(){
    if (animating) return false;
});

Answer 2

使用这种方式打开和关闭你可以将函数foo“绑定”到特定元素上的单击事件，然后根据需要多次关闭它。玩得开心; - ）

DEMO：http://jsfiddle.net/4yBbb/2/

var foo = function() {
// Code to handle some kind of event
};
// ... Now foo will be called when paragraphs are clicked ...
$( "p" ).on( "click", foo );
// ... Foo will no longer be called.
$( "p" ).off( "click", foo );

编辑：更新的答案，我的例子使用委托，这不是必要的。

应用于您的示例，它看起来像这样：

$("something").on("click", function() {
    $("selected").off( "click", foo );
    $("selected").animate({...}, function() {
        $("selected").on( "click", foo );
    });

Answer 3

使用.on（）＆amp; jquery的.off（）事件。这是示例Jquery API

你需要做如下的事情：

function flash() {
  // do your stuff here
}  
$("something").on("click", function() {
    $( "body" ).off( "click", "Your Div Selector", flash );
});
$("something").on("click", function() {
    $( "body" ).on( "click", "Your Div Selector", flash );
});

Answer 4

点击保持永久禁用。

因为永远不会再将"click"绑定到$("something")。尝试：

$("something").on("click", function animate() {
    var _this = $(this);
    _this.off("click");
    $("selected").animate({...}, function() {
        _this.on("click",animate);
    });

这里我使用命名函数，以便再次引用该函数。

Answer 5

如果在click函数中添加一个检查以仅在点击的元素没有动画时执行动画怎么样？

$("something").on("click", function() {
    $("selected").animate({...});
});

$("selected").on("click",function(){
    if(!$(this).is("selected:animated")){
    //Start other animation
    }
});

<强> Demo fiddle

在动画期间禁用单击元素

5 个答案: