jQuery的禁用下一步按钮，直到动画完成

StackOverflow https://stackoverflow.com/questions/3618958

  •  26-09-2019
  •  | 
  •  

题

这是很酷，我很熟悉。不过，我想下一个和上一个按钮，以保持可见，只是没有被点击能。在我的特定情况下，该按钮是设计的一部分图像。我只是希望用户不能够动画结束前通过点击。

有帮助吗？

解决方案 

$(function(){
    $("#previous").bind("click", Previous);
    $("#next").bind("click", Next);
});

function DoAnimation() {
    $("#previous,#next").unbind("click");
    $('#id').animate(
        complete: function() {
            $(this).after('<div>Animation complete.</div>');
            $("#previous").bind("click", Previous);
            $("#next").bind("click", Next);
        }
    });
}

function Previous() { }
function Next() { }

其他提示

一个更技术：

$(".next,.prev").click(function(){
    if ($('#my_animated_elelement').is(':animated'))
    {
        return false;
    }
})

我想您对图像的onclick的javascript调用，使用一个变量MyApp.IgnoreNextPrevClicks来标记的onclick处理程序是否不执行或不。

MyApp={}
MyApp.IgnoreNextPrevClicks=false;
MyApp.PrevClick=function() {
    if(MyApp.IgnoreNextPrevClicks) return;
    //real work goes here
}

现在调用jquery的动画师，集MyApp.IgnoreNextPrevClicks为true，并且动画结束之后将其设置回假之前（使用jQuery动画回调）。

function btn() {
   $('#btn').one('click', function(){
     //call your animation function here.

     setTimeout(btn, animation duration);
  });
}

$('#mybtn').attr("disabled","disabled"); // to Disable Button

$('#mybtn').removeAttr("disabled"); // to Enable Disabled button
许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top