在jQuery模板中的JavaScript函數

似乎我有一些問題在jQuery模板中調用一個JavaScript函數。我有一個演示設在這裏：http://jsfiddle.net/SXvsZ/8/在jQuery模板中的JavaScript函數

代碼如下所示：

function htmlDetail(){ 
    return "hello <strong>world</strong>"; 
} 

var book = [ 
    { title: "Goodnight, World!", 
    detail: { author: "Jojo Mojo", synopsis : "What the ..." }}, 
{ title: "Rainbow", 
    detail: { author: "Cookie", synopsis : "Huh?" }} 
]; 

$("#testTemplate").tmpl(book).appendTo("#bookList");

和模板的樣子：

<script id="testTemplate" type="text/x-jquery-tmpl"> 
    {{if title.length}} 
     <h3>${title}</h3> 
     <p>Start: ${ htmlDetail() } :End</p> 
    {{/if}} 
</script> 

<div id="bookList"></div>

好像它應該呈現「你好世界」我想它也呈現HTML爲HTML而不是純文本。

來源

2011-01-20 Anthony Webb

嗯渲染它，我甚至不知道的jQuery有這個:) – 2011-01-20 01:27:19

呈現來自另一個函數在模板中的HTML，你將需要使用{{HTML}}模板標籤。

<script id="testTemplate" type="text/x-jquery-tmpl"> 
    {{if title.length}} 
     <h3>${title}</h3> 
     <p>Start: {{html htmlDetail() }} :End</p> 
    {{/if}} 
</script>

你也應該移動htmlDetail功能時，您準備好（）函數外

來源

2011-01-20 03:12:59 Harborhoffer

http://api.jquery.com/template-tag-html/

注意這個反正是beta版，使他們沒有最後確定最有可能會改變，甚至被淘汰，所以不要依賴太多作爲尚未ofcourse，但做實驗吧:)

來源

2011-01-20 01:37:28 Val

回到你的問題，問題似乎是htmlDetail需要在模板本身之前定義。（他們的榜樣「建議」認爲）

它在這裏工作：http://jsfiddle.net/SXvsZ/9/

來源

2011-01-20 01:57:06

您可以通過非全局函數模板，使其avialbale在模板中，如果您選擇不加它全球化。

$("#testTemplate").tmpl(book, {htmlDetail : htmlDetail}).appendTo("#bookList");

可以像這樣使用，{{HTML}}將沒有編碼

<p>Start: {{html $item.htmlDetail() }} :End</p>

來源

2011-01-20 21:35:38 thaj

在jQuery模板中的JavaScript函數

回答

相關問題