Небольшая модификация моего кода JQuery

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

Ответ Феликса Клинга правильный.

Также стоит отметить: это очень плохая практика - использовать setInterval таким образом, так как вы не уверены, вернется ли .load в течение указанных 10 секунд. (Подумайте, например, о мобильных устройствах.) Даже если он вернется через 9 секунд, у вас будет всего одна секунда, прежде чем вы отправите следующий запрос. Лучше сделать setTimeout в обратном вызове, вот так:

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

    loadReservationDetails();
});