JQUERY刷新闪烁

时间:2014-08-19 12:26:06

标签: javascript php jquery

我有一小段代码可以刷新页面的一部分。令人耳目一新的部分工作正常,只有我注意到每次刷新它闪烁..任何建议如何摆脱眨眼?

<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>";
?>

4 个答案:

答案 0 :(得分:0)

对代码进行了一些小改动,修复了它...希望其他人可以在其中找到用途。

<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>

答案 1 :(得分:0)

尝试将fast作为hide()show()函数中的参数传递,

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

答案 2 :(得分:0)

取消.show() .hide()而不是使用.html()作为内容。如show hide导致浏览器重新启动两次,但html只导致一次..

答案 3 :(得分:0)

您可以使用div和.get with jquery从您网站上的其他页面获取数据。

您可以使用setTimeOut(函数,时间)

$(function() {
    startRefresh(); });

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