Jquery: загрузка HTML-страницы и другой HTML-страницы через AJAX

Question

  //when document loads
   $(document).ready(function() {

    //navigation item is clicked
     $('.nav_item').click(function() {

    //get the clicked nav items id
    var nav_item = $(this).attr("id");
    var location_to_load = nav_item + '.html';

   //load the loading html then the page
   $('#sliding_content_container').load('loading.html', null, showResponse);

   //load the page
   function showResponse(){
    $('#sliding_content_container').delay(900).load(location_to_load);
   };

   //dont refresh
   return false;
   }); 
   });

Привет, я изучаю Jquery и просто удивляюсь, почему я не могу вызвать «загрузочную страницу», а затем пункт назначения с задержкой, кажется, все, что я пытаюсь, не работает, например, добавление .delayили цепочки функций ..

любая помощь будет отличной, я даю jquery старый добрый треск.

спасибо

Answer 1

Метод delay используется для анимации.
Добавляет элемент задержки в очередь анимации, задерживая любые анимации , вызываемые после нее.
Он будетне влияет на обычные методы.

Вместо этого вы должны вызвать setTimeout функцию , например:

$('#sliding_content_container').load('loading.html', null, function() {
    setTimeout(function() { 
        $('#sliding_content_container').load(location_to_load);
    }, 900);
});

Answer 2

Это нормально, что вы не можете отложить это с помощью .delay (); AJAX по умолчанию является асинхронным (иногда это помогает проверить, что означает сокращение технологии). Прошло довольно много времени с тех пор, как я использовал jQuery, но, насколько я помню, запрос .ajax должен быть подходящим. http://api.jquery.com/jQuery.ajax/

Answer 3

Чтобы задержка работала, вам нужно использовать очередь для вашего следующего вызова для загрузки в showResponse().

function showResponse(){
    $('#sliding_content_container')
      .delay(900)
      .queue(
        function()
        {
          var $this = $(this);
          $this
            .load(
              location_to_load,
              false,
              function()
              {
                $this.dequeue();
              }
            );
        }
      );
};

Если вы хотите, вы также можете использовать очередь, отличную от 'fx', на случай, если вам не удастся использовать эту очередь для анимации.