我正在使用jQuery在加载时(在AJAX调用之后)“闪烁”一些文本,但每当我调用clearInterval时,我都会收到“未定义”的错误。
以下是我的代码片段:
OrderId="a12345";
var AllIDs = {};
AllIDs[OrderId] = setInterval(
function() {j$("#" + OrderId + "_MessageListSize").fadeIn(200).fadeOut(200)},
200
);
然后,在AJAX调用完成后:
OrderId="a12345"; var myid = AllIDs[OrderId]; clearInterval(myid);
为什么clearInterval不会停止动画?是否与我如何使用关联数组对象文字?
提前致谢!
答案 0 :(得分:3)
JavaScript没有关联数组,那些是对象文字。 HTML ID不能以数字开头。您的问题是您过快地安排活动并且他们正在备份。每隔200毫秒,您可以设置两个任务,每个任务需要200毫秒才能完成(400毫秒)。
你可以调整你的间隔,但是如果AJAX还没有完成,那么使用setTimeout()并安排动画回调中的下一个超时真的是一个更好的主意,否则什么也不做,它会停止。无需clearInterval。
像这样......
function scheduleBlink() {
AllIDs[OrderId] = setTimeout(
function() {
j$("#" + OrderId + "_MessageListSize").fadeIn(200).fadeOut(200, function () {
if (!ajaxDone) {
scheduleBlink();
}
else {
return;
}
}))
},
200
);
}
scheduleBlink()
答案 1 :(得分:1)
我怀疑问题是您使用的是200毫秒的超时间隔。淡出需要200毫秒,然后淡入则需要另外200毫秒,但是,该功能每200毫秒调用一次,因此在第一个调用完成时,另一个调用已经开始。尝试在启动后很快清除间隔,看看它是否会在几秒钟后停止。
这是一个示例html文件,对我来说正常工作,2秒后停止闪烁。
<html>
<head>
<title>test</title>
<script type="text/javascript" src="jquery-1.6.4.js"></script>
</head><body>
<h1 id="target">Hello, World</h1>
<script type="text/javascript">
timeout_id = setInterval(function(){
$("#target").fadeOut(200).fadeIn(200);
}, 400);
setInterval(function(){ clearInterval(timeout_id); }, 2000);
</script>
</body>
</html>
例如,如果我将400毫秒更改为100毫秒,并刷新页面,则闪烁停止需要更长时间。