使用ajax间隔刷新时如何停止文本或元素的闪烁?
<script>
$(document).ready(function()
{
setInterval(doAjaxStuff, 500);
});
function doAjaxStuff()
{
/* $.ajaxSetup ({ cache: false }); */
$.ajax
({
url: "../getStatus/"+id,
dataType: 'json',
success: function(json)
{
if(json.status == "ACTIVE")
{
$('#ajaxStatus').html(jason.status);
}
});
}
</script>
//I get refreshed and cause flickering
<p id= ajaxStatus > Refresh Me</p>
<script>
$(document).ready(function()
{
setInterval(doAjaxStuff, 500);
});
function doAjaxStuff()
{
/* $.ajaxSetup ({ cache: false }); */
$.ajax
({
url: "../getStatus/"+id,
dataType: 'json',
success: function(json)
{
if(json.status == "ACTIVE")
{
$('#ajaxStatus').html(jason.status);
}
});
}
</script>
//I get refreshed and cause flickering
<p id= ajaxStatus > Refresh Me</p>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
有一个更容易使用的 jquery 函数来从页面加载文本。
您可以将整个 .ajax 调用替换为 $("#ajaxStatus").load("../getStatus/" + id)
不确定这是否会停止闪烁,但至少应该使程序更干净。
there is an easier to use jquery function to load text from a page.
You could replace the whole .ajax call with $("#ajaxStatus").load("../getStatus/" + id)
Not sure if that stops the flickering but at least should make the program cleaner.
我在使用
jquery load();
时遇到了同样的问题。在加载到 #div 的
ajax.php
中,我再次包含了 jquery 库和样式表。所以新内容有新的风格和 jquery 功能,对吗?发现新的内容继承了父级的css和js功能!
底线:
在新加载的 div 中包含相同的 css 作为父级会导致闪烁,因为 html 元素会再次设置样式。
I had the same problem on using a
jquery load();
In the
ajax.php
that i loaded into the #div i included the jquery lib and my stylesheet again. so the new content got new style and jquery functions right?Found out the new content picks up the parent css and js functions!
bottomline:
including same css in new loaded div as parent cause blinking because the html elements get styled again.
尝试添加一个检查,以便仅在值发生更改时更新。
Try to add a check so you only update if the value has changed.
我想说500太快了。您必须记住,即使 ajax 调用未完成,间隔也会继续进行并请求信息。我的建议是要么将 setInterval 更改为 setTimeout 并在成功时重新初始化超时,要么将间隔提高到 1500-2000。不过你最好还是超时
I would say 500 is way too fast. You have to remember that the interval will keep going and requesting the info even if the ajax call is not completed. my suggestion is to either change setInterval to setTimeout and reinitialize the timeout on success, or crank up the interval to 1500-2000. You better off with the timeout though
使用这个:
Use this: