我已经阅读了很多主题和 jQuery 文档,但我仍然无法解决这个问题。
我所拥有的是不透明度为 0 和一些背景颜色的 div。在某些按钮的用户“单击”事件中,我调用“StartAnimationFuncton”函数,该函数使 div 的不透明度为 1 并添加加载图像。
然后,当从服务器接收到信息时,我调用“StopAnimationFuncton”函数,该函数应该删除正在加载的 div,然后再次使背景 div 的不透明度为 0。
注意:我在删除之前将延迟(1000)设置为加载,因为如果请求完成得太快,加载会显示一毫秒并且看起来很难看。
//StartAnimationFuncton
$("#BackGroundDiv").stop('fx',true,false).animate({opacity:1.0},1000,function(){
$('#ShopperPortalLoadingDivContentTable').remove();
$('<div id="Loading" style="width:100%;height:100%"></div>').hide().appendTo('#BackGroundDiv').stop('fx',true,false).fadeIn(500,function(){
...
//Waiting data from the server - when the date is call the StopAnimationFunction
...
});
});
//StopAnimationFuncton
$('#Loading').stop(true,false).delay(1000).fadeOut(500,function(){
$(this).remove();
$("#BackGroundDiv").stop(true,false).animate({opacity:0.0},1000,function(){
ShopperPortal.Content.Functions.Render.InitializeRenderModeContainerAndLoadingEffects.Parameters.IsStopLoadingEffectActive=false;
});
});
我的问题是,当用户在按钮上“单击”多次时,当前动画不会停止。我尝试了所有变体 - 对每个元素组合使用 stop(),stop('fx',true,false), stop(true,true), stop(true,false),但没有任何帮助。
停止当前动画和完成功能的正确方法是什么?还。如果我的逻辑不正确,我是否愿意接受新想法?
编辑 1:我正在使用 jQuery 版本 1.8.2
EDID 2:我已经读到延迟(1000)可能会导致问题,因为它不能被删除/取消。
Jquery .delay().fadeOut 取消/清除队列.. 有可能吗?如何?
http://forum.jquery.com/topic/stop-does-not-clear-delay
这就是为什么我用动画({opacity:1.0},1000) 替换它但没有任何改变的原因。