jQuery .load（）不加載插件

我有一個包含2個鏈接的主頁，通過.load（）加載外部文件。第一個文件有一個簡單的JavaScript翻轉，當內容被加載時工作。第二個文件有一個jQuery插件，當通過.load（）加載時不起作用 - 但在數據文件被自己查看時工作正常。jQuery .load（）不加載插件

主文件：http://gator1105.hostgator.com/~carc/test-load.html通過自身工作

第二個數據文件，但不能從.load（）（如上相同的URL，但該文件是測試負載two.html - StackOverflow上會允許我創建只有1個超鏈接）而不是粘貼我的源代碼在這裏，你可以從頁面本身查看它。

如何在載入.load（）時獲得第二個幻燈片放映文件？

來源

2010-03-04 jac

忽略這個答案

你的第二個文件執行其初始化一個「的document.ready」塊。當您的內容通過AJAX加載時，這不會運行。嘗試將第二頁中的代碼放在「document.ready」中，這樣它就是一個純粹的腳本塊。

哦，我看到了 - 不僅是「document.ready」塊內的腳本（當然不是了），但第二頁是一個完整的HTML文檔。您無法將完整的HTML文檔加載到另一個文檔的中間，它沒有任何意義，jQuery只會抓住正文中的內容。因此，請嘗試將您的腳本標記移動到身體中，看看會發生什麼。（你還是不想要「document.ready」，我不這麼認爲。）

[edit again]實際上我回過頭來 - 我不認爲jQuery去掉任何東西;我只是打賭瀏覽器變得困惑。

[edit yet again]好的，好吧，我看到你已經改變了它 - 讓我採取一個非常接近的樣子。

來源

2010-03-04 16:08:58 Pointy

我刪除了document.ready塊，它仍然失敗。 – jac 2010-03-04 16:12:18

我更新了答案。 – Pointy 2010-03-04 16:16:37

不好。我改變了主要文檔，只是在＃content-area div（不是整個HTML文件）中引入並移動了該div內的腳本。仍然失敗。 – jac 2010-03-04 16:22:48

這是因爲.load只是加載並設置HTML到你說的元素和腳本標籤外所有這

來源

2010-03-04 16:29:44 ElAlecs

不，他把腳本移到了結果的主體中。 jQuery「html（）」函數的作用方式是它去掉腳本元素，在更新DOM時保留它們，然後運行腳本。 – Pointy 2010-03-04 16:39:15

我認爲你錯了，jQuery只拿你需要的部分，所以，腳本已經出來，不是進程 – ElAlecs 2010-03-04 17:45:23

你是對的 - 當你在URL之後給load（）一個選擇器時，腳本不會被執行。當你**不提供選擇器時，然而，腳本**被**執行。這對API來說是一種奇怪的方式，我認爲這是一種錯誤。 – Pointy 2010-03-04 18:31:25

確定這裏有一個更好的答案：對於原因，我不明白，當你加載一個片段（或一整頁;無論）使用特殊的「選擇器」特技到挖出僅有文檔的一部分與jQuery：從內容

var showThisContent = this.id; 
$('#content').load('test-load-' + showThisContent + '.html #content-area');

jQuery庫帶出腳本完全 ，並且永遠不會運行它們。爲什麼？我不知道。我知道你可能不再信任我，但這是我對你的源代碼所做的事情：我拿了第二個文件（test-load-two）並且刪除了頭部和東西;基本上我把它做成只包含「內容區域」的片段。（我也擺脫了加載jquery的腳本標記，因爲你並不真的需要這樣做，因爲外部頁面已經擁有它了。）然後我改變了主頁面（test-load），這樣當它調用「load」時只需傳入網址而沒有即'＃content-area'選擇器。這樣可行。

[編輯]我剛剛發佈了jQuery論壇中發帖提問：http://forum.jquery.com/topic/the-load-function-and-script-blocks

來源

2010-03-04 16:59:33 Pointy

工作。 http://gator1105.hostgator.com/~carc/test-load.html謝謝！ – jac 2010-03-04 18:02:12

沒問題。對不起，最初導致你誤入歧途。我用過「load（）」，但我從來沒有注意到這個特殊的古怪。看起來像是一個bug，特別是因爲這個小細節沒有記錄。 – Pointy 2010-03-04 18:29:58

我實際上可以做了與我工作的網站類似的東西。你要做的是爲主頁上的$ .load（）調用的每個頁面創建一個回調函數。

請看下面的代碼從the jquery.load() documenation：

$('#result').load('ajax/test.html', function() { 
    alert('Load was performed.'); 
});

你的具體情況，你會希望這樣的事情主要測試load.html頁面上。

$(document).ready(
    function(){ 
    $('li').click(function(){ 
     var showThisContent = this.id; 
     $('#content').load('test-load-'+showThisContent+'.html', function(){ 
       if (showThisContent == "one"){ 
        //Do logic for test-load-one.html 

        //Pre-load your images here. 

        //You may have to assign a class to your anchor tag 
        //and do something like: 
        $('a.assignedClass').mouseover(function(){}); 
        $('a.assignedClass').mouseout(function(){}); 
       } //end if 
       if (showThisContent =="two"){ 
        //Do logic for test-load-two.html here 
        $('.slideshow').cycle({ 
         fx: 'fade', 
         speed: 500, 
         timeout: 0, 
         next: '.nextSSimg', 
         prev: '.prevSSimg', 
         pager: '#SSnav', 
         cleartype: true, 
         cleartypeNoBg: true 
        }); //end .cycle() 
       } //end if 
      ); //end .load(location, callback function()) 
    }); //end $('li).click() 
}); //end $(document).ready()

現在，很明顯，我沒有轉換的所有代碼，但這裏發生了什麼是一旦的document.ready完成後，回調函數就會運行，因爲像「的元素.slideshow」現在加載進入DOM，您的回調代碼將適當地綁定到它們。你可以用幾種方式切換這段代碼，使其具有相同的結果（即，將2個$ .load（）包裝進條件中，而不是在.load回調中執行條件邏輯，和/或將一個callbackOne ）和callbackTwo（）函數上面的document.ready，然後適當調用它們），但這是你的偏好。您應該能夠使用$ .load（）的回調函數參數來執行您想要的操作。

來源

2010-06-24 16:52:37 JustinP8

不要去$.load。相反，嘗試$.get，這看起來可能不太舒服，但它在另一種情況下適用於我。示例代碼如下。

$(li).click(function() { 
    // your code for finding the id 
    $.get('test-load-' + id + '.html', function(responseHtml){ 
     $('div#content-area').empty().append($(responseHtml)); // remove all elements from #content-area 
     // $('...').html(responseHtml) will not work 
    }); 
});

我希望這可以解決您的問題。

來源

2010-07-27 12:32:25 Daniel

jQuery .load（）不加載插件

回答

相關問題