Question

我正在开发一个网页，其中包含一个名为headlines的类的div，它每10秒自动刷新一次，问题是当数据加载到div时，它会闪烁，我想得到摆脱它。

$(document).ready(function() {
  setInterval(function() {
    $('.headlines').load('headlines.php');
  }, 10000); 
});

Answer 1

如果使用.load()，您将无法摆脱眨眼。它闪烁，因为它初始化请求，清除.headlines，并从服务器加载响应。这种反应不是即时的。

您可以改为使用$.ajax，并在success方法中重写.headlines的内容。

修改

以这种方式思考......如果响应永远不会加载，那么当您使用.load()时，它将等待响应。在等待期间，.headlines将无限期空白。

相反，您可以做的是等待.headlines上下文之外的服务器响应。

setInterval(function() {
    $.ajax({
        url: 'your-url.html',
        success: function(res) {
          $('.headlines').html(res.data);   
        }
    });
}, 10000);

您需要查看jQuery文档。

Answer 2

如Josh Beam所述，您需要使用$.get()函数来完成工作！所以更新您的代码，如：

$(document).ready(function() {
    setInterval(function() {
        $.get('headlines.php', function (data) {
            $('.headlines').html(data);
        });
    }, 10000); 
});

$.load()功能将闪烁。所以我们可以使用任何其他AJAX函数，可能是$.ajax()或$.get()，在success函数中，我们可以更新.html()的{{1}}。 / p>

每次加载时，Ajax自动刷新都会闪烁

2 个答案:

修改