JQUERY刷新闪烁

JQUERY refresh blinking

本文关键字：闪烁 刷新 JQUERY      更新时间：2023-09-26

我有一小段代码，应该刷新页面的一部分。刷新部分工作得很好，只是我注意到每次刷新它都会闪烁。有什么建议可以消除眨眼吗?

<html>
<head>
<title>test</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
(function($)
{
    $(document).ready(function()
    {
        $.ajaxSetup(
        {
            cache: false,
            beforeSend: function() {
                $('#content').hide();
                $('#loading').show();
            },
            complete: function() {
                $('#loading').hide();
                $('#content').show();
            },
            success: function() {
                $('#loading').hide();
                $('#content').show();
            }
        });
        var $container = $("#content");
        $container.load("ajaxstatus.php");
        var refreshId = setInterval(function()
        {
            $container.load('ajaxstatus.php');
        }, 9000);
    });
})(jQuery);
</script>
</head>
<body>
<div id="wrapper">
    <div id="content"></div>
</div>
</body>
</html>

这是php文件;

<?php
echo "1test<BR>";
echo "32333<BR>";
echo "2dddd2111<BR>";
echo "2dddcvbcvbd2111<BR>";
echo "2dsdfbddd2111<BR>";
?>

对代码做一个小改动就修复了它。希望其他人能从中找到用处。

<html>
<head>
<title>test</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function() {
    startRefresh();
});
function startRefresh() {
    setTimeout(startRefresh,1000);
    $.get('ajaxstatus.php', function(data) {
        $('#content').html(data);    
    });
}
</script>
</head>
<body>
<div id="wrapper">
    <div id="content"></div>
</div>
</body>
</html>

尝试将fast作为参数传递给hide()和show()函数，如

success: function() {
        $('#loading').hide('fast');
        $('#content').show('fast');
}

去掉.show()，用.hide()代替.html()。显示隐藏会导致浏览器重新启动两次，而HTML只会导致一次。

你可以使用jquery的div和。get从你网站的另一个页面获取数据。

可以使用setTimeOut(function, time)

$(function() {
    startRefresh(); });
function startRefresh() {
    setTimeout(startRefresh,1000);
    $.get('pagelink.php', function(data) {
        $('#content_div_id').html(data);    
    }); }
相关文章：