您可以將JQuery模板存儲在.js文件或類似文件中嗎？

我有一個webservice返回一個項目，它可能是幾種類型之一。我想要使用jQuery來模板化它，並根據它是什麼類型的對象，使用適當的模板。您可以將JQuery模板存儲在.js文件或類似文件中嗎？

我想知道什麼是存儲各種模板的最佳方式。我想把它們放到一個名爲ItemTemplates.js的文件中，或者其他的都可以，並且每個文件都有一個名稱，例如Cat_Template Dog_Template，我可以使用開關根據對象返回的類型加載正確的文件。

jQuery模板可以存儲在js文件中嗎？有沒有另一種好辦法呢？我正在使用asp.net，因此可能有解決方案在那裏？

來源

2011-04-08 NibblyPig

如果你指的是存儲這樣的JavaScript文件中：

<script id="myTemplate" type="text/x-jquery-tmpl"> 
    <li> 
     <a href="${Url}" target="_blank">${Text}</a> 
    </li> 
</script>

這只是不可能這樣，因爲這是HTML和.js文件不被解析爲HTML。我能想到的唯一替代方案是動態的.js文件中的$（document）。就緒使用類似

document.write('<script id="myTemplate" type="text/x-jquery-tmpl">template HTML</script>');

或

產生這樣的HTML（）

$('<script id="myTemplate" type="text/x-jquery-tmpl"></script>') 
    .html('template HTML') 
    .appendTo('body');

沒有測試這之前，所以我不知道它會起作用。

來源

2011-04-08 12:09:34 Zifik

優秀的jQote（overview,latest version）是一個靈活的jQuery模板庫。從文檔：

<script type="text/html" id="template"> 
<![CDATA[ 
    <p class="greetings"> 
     Hello <%= this.name %>, how are you doing? 
     May I offer you 
     <% this.is_starving() ? %> 
      some tasty peasant? 
     <% : %> 
      a refreshing Singha? 
     <% ; %> 
    </p> 
]]> 
</script>

您可以存儲多達/數這些腳本塊的，你在一個文件喜歡，我一般就把他們都到主.js與我的代碼的其餘部分。由於它們是標準HTML腳本標記，因此它們也可以進入主頁面，或通過AJAX加載並寫入文檔。

來源

2011-04-08 12:09:47 Andy

埃裏克Feminella寫了一個整潔的小除了* * jQote2 **插件，可以更輕鬆地加載外部模板。看他的帖子：http://www.ericfeminella.com/blog/2011/12/12/external-templates-in-jqote2/ – aefxx 2011-12-15 09:00:41

我已經構建了一個輕量級模板管理器，通過Ajax加載模板，它允許您將模板分離爲更易於管理的模塊。它還執行簡單的內存緩存以防止不必要的HTTP請求。（我使用jQuery.ajax這裏爲簡便起見）

var TEMPLATES = {}; 

var Template = { 

    load: function(url, fn) { 
    if(!TEMPLATES.hasOwnProperty(url)) { 
     $.ajax({ 
     url: url, 
     success: function(data) { 
      TEMPLATES[url] = data; 
      fn(data); 
     } 
     }); 
    } else { 
     fn(TEMPLATES[url]); 
    } 
    }, 

    render: function(tmpl, context) { 
    // Apply context to template string here 
    // using library such as underscore.js or mustache.js 
    } 

};

你會再使用此代碼如下所示，通過回調處理，模板數據：

Template.load('/path/to/template/file', function(tmpl) { 
    var output = Template.render(tmpl, { 'myVar': 'some value' }); 
});

來源

2011-04-08 13:17:47

我喜歡這種方法。您可以通過使用封閉喜歡它清理乾淨，以便：App.Template =（函數（）{VAR 模板劑= []; 回報{ \t負荷：... \t \t渲染：... }; }）（）; – havana59er 2012-03-10 20:30:33

您可以將JQuery模板存儲在.js文件或類似文件中嗎？

回答

相關問題