爲什麼這個代碼不是加載頁面ajax jquery

夥計們我試圖做的是在導航上加載一個頁面點擊ajax並將其中的一些延遲加載什麼都不點擊我想加載主頁加載動畫與jquery與PHP代碼延遲如果在導航的東西被點擊我要加載特定文件但是這個代碼似乎並不奏效爲什麼這個代碼不是加載頁面ajax jquery

var res = { 
    loader: $('<div />', {class: 'loader' }), 
    container: $('.content') 
}; 

$(document).ready(function(){ 
      $.ajax({ 
       url: 'templates/delay.php', 
       beforeSend, function(){ 
        res.container.append(res.loader); 
       }, 
       success, function(){ 
        res.container.find(res.loader).remove(); 
        $('.content').load('templates/pages/home.php'); 
       } 
      }); 
      $('ul#nav_a li a').click(function(){ 
       $.ajax({ 
       url: 'templates/delay.php', 
       beforeSend, function(){ 
        res.container.append(res.loader); 
       }, 
       success, function(){ 
        res.container.find(res.loader).remove(); 
        var page=$(this).attr('href'); 
        $('.content').load('templates/pages/'+page+'.php'); 
         return false; 
        }); 
      }); 
       } 
      });

來源

2014-11-08 Muhammad Asim Khan

爲什麼要在服務器端運行延遲計時器？對我來說似乎完全沒有必要。 – 2014-11-08 15:59:45

你正在做不值得的事情。爲什麼你確實使用ajax來延遲。你不需要這樣做。只顯示加載，並請求服務器獲取您想要的數據，然後將其放入相應的元素。最後，隱藏加載。這很簡單。 – jewelnguyen8 2014-11-08 17:05:55

我不會討論代碼本身，而只是提高它。

試試這個代碼，並告訴我，如果你得到你想要的東西：（JS代碼的註釋中）

$(document).ready(function(){ 
    $.ajax({ 
     url: 'templates/delay.php',  
     // old code : beforeSend, 
     beforeSend: function(){ 
      res.container.append(res.loader); 
     }, 
     // old code : success, 
     success: function(){ 
      res.container.find(res.loader).remove(); 
      $('.content').load('templates/pages/home.php'); 
     } 
     // beforeSend and success are keys with functions as values that's why we use ":" and not "," 
     // the "," comma is used to separate ajax settings 
    }); 
    $('ul#nav_a li a').click(function(){ 
     var page = $(this).attr('href'); 
     $.ajax({ 
      url: 'templates/delay.php', 
      // old code : beforeSend, 
      beforeSend: function(){ 
       res.container.append(res.loader); 
      }, 
      // old code : success, 
      success: function(){ 
       res.container.find(res.loader).remove();      
       $('.content').load('templates/pages/'+page+'.php'); 
      // old code 
      // return false; 
      // }); 

      // we close our ajax.success function 
      } 
     }) 
     // old code 
     // } 

     // return false is used to prevent browser to run the a href that's why we use it in the a.click function and not inside the ajax block 
     return false; 
    }) 
})

來源

2014-11-08 16:51:39 akmozo

是的你改進了代碼非常好，但我仍然有這個網站的問題，你可以看看它它住@ www.askasim.com – 2014-11-08 17:08:48

我認爲我得到你的問題。它是'var page = $（this）.attr（'href'）;'它應該在ajax塊之外才能正常工作。我編輯了我的答案。 – akmozo 2014-11-08 17:14:17

現在的問題是，當我們點擊一個導航按鈕，它不會隱藏以前加載的內容，並顯示該內容頂部的加載器 – 2014-11-08 17:20:46

var res = { 
    loader: $('<div />', {class: 'loader' }), 
    container: $('.content') 
}; 
$(document).ready(function(){ 
     res.container.append(res.loader); 
     $('.content').load("templates/pages/home.php", function() { 
      res.container.find(res.loader).remove(); 
     }); 
     $('ul#nav_a li a').click(function(){ 
      var page=$(this).attr('href'); 
      $('.content').load('templates/pages/'+page+'.php', function() { 
       res.container.find(res.loader).remove(); 
      }); 
     }); 
    } 
});

只需複製並粘貼。

來源

2014-11-08 17:24:55

爲什麼這個代碼不是加載頁面ajax jquery

回答

相關問題