Question

您好我如何编辑以下代码以自动重新加载指定div的内容？

下面我的代码重新加载了一个名为form.php的文件，我希望用div代替。

<style>
    .loading { 
        height:24px; 
        background: url('http://b.static.ak.fbcdn.net/rsrc.php/v1/yb/r/GsNJNwuI-UM.gif') 50% 50% no-repeat; 
        }
</style>

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js'></script>
<script language='JavaScript'>
setInterval( 'SANAjax();', 10000 );  ///////// 10 seconds

$(function() 
{
    SANAjax = function()
    {     
        $('#reservationdetails')
            .empty()
            .addClass('loading')
            .load('form.php', function()
            {
                $('#reservationdetails').removeClass('loading') 
            });

    }
});
</script>

谢谢！

Answer 1

重新排序代码：

$(function() {
    var SANAjax = function(){
        $('#reservationdetails').empty().addClass('loading')
          .load('form.php', function() {
             $(this).removeClass('loading') 
          });
    }
    setInterval(SANAjax, 10000 );
});

我认为#reservationdetails是您要加载响应的div。

无需将字符串传递给setInterval。始终将函数引用传递给它（setTimeout）相同。

Answer 2

Felix Kling的回答是正确的。

另外值得注意的是：以这种方式使用setInterval是非常糟糕的做法，因为您不确定.load是否会在您指定的10秒内返回。（例如，想想移动设备。）即使它确实在9秒内返回，但在你发出下一个请求之前它只有一秒钟。最好在回调中做setTimeout，如下所示：

$(function () {
    function loadReservationDetails() {
        $('#reservationdetails')
            .empty()
            .addClass('loading')
            .load('form.php', function () {
                $(this).removeClass('loading');
                setTimeout(loadReservationDetails, 10000);
        });
    }

    loadReservationDetails();
});

对我的jQuery代码进行小修改

2 个答案: