jQuery的通過ID

引用外部模板腳本當我使用jQuery指腳本...jQuery的通過ID

var template = _.template($('#homeTemplate').html(), args);

...它的工作原理，但只有當腳本在<head>這樣的...

<script type="text/template" id="homeTemplate"> 
    <div class="homePage"> 
     <% /* stuff */ %>  
    </div> 
</script>

如果我將它移動到這樣一個外部文件...

<script src="js/templates/hometemplate.js" type="text/template" id="homeTemplate"></script>

它停止工作。爲什麼？我該如何解決這個問題？

2014-02-10 PrimeLens

我可以看到混淆來自何處 - 模板內容通常放置在腳本標記中的唯一原因是因爲這可以防止瀏覽器在DOM中意外生成該HTML。

包括js/templates/hometemplate.js將而不是生成一個DOM元素，您可以使用jQuery進行選擇。使用AJAX，而不是搶從JS /模板/ hometemplate.js內容：

$.ajax({ 
    url : 'js/templates/hometemplate.js' 
}).done(function(data) { 
    _.template(data,args); 
});

2014-02-10 01:22:25 adamb

非Ajax解決方案是什麼？ – PrimeLens

在hometemplate.js中，必須添加模板字符串作爲全局變量...類似於：'window。_tempTemplate ='您的模板';'然後，在您的主腳本中包含引用global var：'_.template（window._tempTemplate）;' – adamb

瞭解它。只要將這個獎勵作爲我正確接受的答案。當我列出可能的選擇時，我也想呼籲Dennis Cheung的評論。謝謝阿丹姆 – PrimeLens

第二種方法不起作用homeTemplate的innerHTML是一個空字符串。解決方案是使用第一個工作方式或通過Ajax加載模板。

2014-02-10 01:20:46 undefined

這一點使用你提到的第一個工作方法，我怎麼會做？ – PrimeLens

第一種方法是在你的問題中，設置腳本標記的'innerHTML'。如果你有很多使用Ajax的模板是最好的選擇。 – undefined

好吧我的誤解，不是'第一個工作方法'，你的意思是我在原帖中的第一個工作方法。得到它了。 – PrimeLens

的<script>模板破解，用於包括「非HTML」一個HTML文檔中。如果您不想將它嵌入到HTML中，請不要使用<script>。

只有很少的方法可以獲得一個模板，一個字符串太長，到您的Javascript，有優點和缺點。

BTW。爲什麼你不希望你的模板被嵌入到HTML中，當模板應該很小時（與完整的HTML相比），它會引入額外的往返延遲延遲？

2014-02-10 01:32:50

你可以使用AJAX抓取它們。不過，我喜歡讓他們像一個單個的JS文件組織：

Templates = {}; 

Templates.myTemplate = [ 
    "<section>", 
     "<article><% /* stuff */ %></article>", 
    "</section>" 
    ].join('\n');

Templates對象，然後可以在全球應用程序對象上的屬性app.Templates

2014-02-10 01:38:19

回答