Ajax調用加載當前內容

我已經瀏覽了很多論壇，討論我的大腦試圖獲得這個超級簡單的加載函數的工作。我已經將其縮小到我認爲loadContent函數的.fadeIn()部分中的選擇器問題。Ajax調用加載當前內容

我可以看到它爲什麼會一直加載相同的東西，因爲它使用相同的選擇器，但基於我一直試圖使用的教程（http://css-tricks.com/rethinking-dynamic-page-replacing-content/）以及其他（甚至更多破碎）方法，我DID開始工作（基於此：http://code.tutsplus.com/tutorials/how-to-load-in-and-animate-content-with-jquery--net-26），它似乎應該工作！

我試過使用$(href)作爲選擇器，但它只是淡化舊內容並且不加載任何內容。我也試着添加一個alert來查看href是什麼，然後返回正確的html頁面，然後返回正確的元素id（Articles/Cats.html #content）。

這裏是函數本身，如果你需要更多的信息，我會很高興給它！任何幫助都會令人難以置信，很好，很有幫助！

function articleClickLoad() { 
    if (Modernizr.history) { 

     var newHash  = "", 
      $Content  = $("#content"), 
      $el; 

     $("#content").on("click", "a", function() { 

      var _link = $(this).attr("href"); 
      var toLoad = $(this).attr('href')+' #content'; 

      history.pushState(null, null, _link); 
      loadContent(toLoad); 
      return false; 
     }); 

     function loadContent(href){ 

      $Content.find("#content"); 
      $Content.fadeOut(1000, function() { 
       $("main").load(href,'', function() { 
        $Content.fadeIn(1000); 
       }); 
      }); 
     } 

     $(window).bind('popstate', function(){ 
      _link = location.pathname.replace(/^.*[\\\/]/, ''); //get filename only 
      loadContent(toLoad); 
     }); 
    } 
} 
articleClickLoad();

謝謝！

來源

2014-10-28 mconway116

您並未從任何位置加載任何新數據，因此您希望新數據來自哪裏？ – orhanhenrik 2014-10-28 21:29:26

@Izzey'$（「main」）。load（...）'不加載數據？ – 2014-10-28 21:33:46

好.load正在調用href，這是新的頁面內容，但我真的不知道如何使內容淡入淡出 – mconway116 2014-10-28 21:33:57

我看到兩個潛在的問題。 .load需要網址 ~~，但由於某種原因，您在點擊處理程序中添加了 ' #content';它應該被刪除~~ 更新：我忽略了傳遞一個頁面片段是完全有效的，忘記了這一點。

在您的loadContent方法中，您在選擇器$("main")上調用load。目前尚不清楚main可能是什麼，但我想它應該是#content。

另請注意，您可以從.load調用中刪除第二個參數''。請參閱.load documentation。

來源

2014-10-28 21:34:34 digitalbreed

'$（「main」）'是index.html中'＃content'的父項，所以我不想將加載的'＃content'作爲子項添加到現有的'＃content'中。我使用的教程（它工作的很好！）基本上用'_link +「#content」'調用了'.load'，所以我想我可以把它放到一個變量'toLoad'中。 – mconway116 2014-10-28 21:40:24

請注意，當$（「main」）'最初是'$ Content'時，我仍然有這個問題。 – mconway116 2014-10-28 21:44:43

好吧。我只是認識到.load（'url #id'）也是完全有效的。對不起，這沒有任何幫助。 – digitalbreed 2014-10-28 22:21:00

Ajax調用加載當前內容

回答

相關問題