jQuery模塊化腳本架構 - 延遲加載vs內聯加載

我正在構建一個template.htm頁面，其中包含幾個加載了ajax的內容塊。因爲我遇到了問題，我加載的東西synchronously像這樣：jQuery模塊化腳本架構 - 延遲加載vs內聯加載

$.ajax({ 
     url: 'module.htm' 
    }) 
    .done(function(r) { 
     $('#moduleA').html(r); 
    });

我這樣做了幾次，加載各種不同的module.htm文件。他們都有一個標準的html文件，其中包括<!DOCTYPE html>以及頭文件，正文等。還有很多jQuery。

一些這些模塊中的具有動態添加元素，大都採用.append()這樣

$.ajax(......) 
.done(function(response) { 
    var item = $.parseJSON(response); 
    // iterating voer the JSON and appending elements 
    $('div').myPluginMethod(); // utilizing the plugin here 
});

我利用特定$.fn.myPluginMethod一個插件，並且注意到一個問題：

問題： 當在module.htm的頭文件中使用<script>加載插件並自行運行它 - 在template.htm之外，一切正常。在控制檯中，我可以輸入$.fn.myPluginMethod並返回該功能。

但是，如果我將module.htm文件加載到父頁面template.htm中，則不再有效。在控制檯中，輸入$.fn.myPluginMethod返回undefined。

它沒有任何意義。 Firebug顯示加載的插件腳本，爲什麼它會失敗？

我的理論 不知何故，我認爲這是做我的ajax負載。 .done()方法以某種方式無法「看見」插件的對象，因此它會拋出unknown method error。我可以手動粘貼插件，然後它的工作原理：

$.ajax(......) 
.done(function(response) { 
    var item = $.parseJSON(response); 
    // iterating voer the JSON and appending elements 
    // I can paste my raw plugin code here and it will work, but that's silly 
});

我試圖理解爲什麼AJAX業務造成的問題。我認爲一旦插件被加載到DOM中，所有的腳本，動態或不能，都將能夠「看到」它的方法。

謝謝。

來源

2013-02-02 tim

聽起來好像你是從遠程文件再次加載jQuery.js。這將覆蓋主頁面中的jQuery對象。然後，註冊到初始jQuery對象的任何插件都將被清除。

來源

2013-02-02 02:19:01 charlietfl

是。我一直在擺弄，並得出結論，我正在接近這真的不是正確的方式。我希望能夠自己查看模塊，然後將它們拼貼成模板，但我沒有做到正確。必須有一個最佳實踐方法...我還沒有發現它。 – tim

設置服務器代碼，以便在頁面由ajax加載時不包括jQuery.js。可以發送數據到服務器'$ .ajax（{data：{ajax：true}，url：'module.htm'....'並檢查服務器上的'ajax'參數 – charlietfl

jQuery模塊化腳本架構 - 延遲加載vs內聯加載

回答

相關問題