Почему параметры не отправляются функции в setInterval () все время? - PullRequest
1 голос
/ 29 июля 2011

У меня есть страница, которая автоматически обновляет контент через Ajax. Я хочу, чтобы это было незаметно, поэтому я не хочу отображать мой загрузочный GIF во время автоматического обновления страницы. Поэтому я сделал что-то подобное с моей функцией getPosts (ненужный код вырезан для краткости)

function getPosts(image) 
            {
                //loading icon while getPosts
                if (image)
                {
                    $("#postcontainer").bind("ajaxStart", function(){
                        $(this).html("<center><img src='ajax-loader.gif' /></center>");
                });
                } //... ajax call, etc. don't worry about syntax errors, they aren't in real code

Я знаю, что центральная метка устарела, просто бесстыдный ярлык. И тогда я установлю интервал как setInterval(function() { getPosts(false); }, 10000); Поэтому мои автоматические вызовы не приведут к отображению изображения Все мои обновления вручную будут называться так getPosts(true);

Вы можете (вероятно) увидеть ошибку в действии на моем личном сайте

Проблема в том, что функция setInterval, похоже, использует образ bool из последнего вызова функции. Таким образом, он не отображает изображение сначала во время автоматических вызовов, но после того, как я нажму ручное обновление, он начнет показывать изображение во время каждого вызова.

Как с этим бороться?

Спасибо всем, кто просматривает / публикует эту тему! Я надеюсь, что этот вопрос станет хорошей ссылкой для других.

Ответы [ 2 ]

0 голосов
/ 29 июля 2011

Проблема в том, что как только вы привязали свой обработчик «ajaxStart» к контейнеру, он будет выполняться при каждом вызове ajax для этого контейнера. То есть при первом вызове с помощью getPosts(true) будет создана привязка. В следующий раз, когда вы вызываете его с помощью getPosts(false), он не идет по этому пути if, но привязка все еще существует, поэтому, когда вы делаете свой вызов ajax, обработчик все еще выполняется - и обработчик не имеет никаких условных логика. (На самом деле, я полагаю, что в результате вы получите несколько привязок для события «ajaxStart», которое создается каждый раз, когда вы вызываете getPosts(true), но они, вероятно, не заметны, поскольку все они просто делают одно и то же, перезаписывая один и тот же HTML. )

Почему бы не сделать что-то вроде этого:

function getPosts(image) {
  if (image) {
    $("#postcontainer").html("<center><img src='ajax-loader.gif' /></center>");
  }

  // Actual ajax call here
}

setInterval(function() { getPosts(false); }, 10000);
0 голосов
/ 29 июля 2011

Потому что после первого обновления вручную вы прикрепили обработчик событий «ajaxstart», который должен показывать изображение при запуске вызова ajax.Теперь этот обработчик событий существует даже в случае, если вы вызываете функцию с image = false.Он будет срабатывать при всех вызовах ajax.

Что вам нужно сделать, это что-то вроде:

 $("#postcontainer").bind("ajaxStart", function(){
                        $(this).html("<center><img src='ajax-loader.gif' /></center>")
          //Remove event handler
          $(this).unbind("ajaxStart");
});
...