jQuery的模板 - 關聯數據模板的DOM元素

我使用jQuery的模板插件呈現幾行項目類同的：jQuery的模板 - 關聯數據模板的DOM元素

var clientData = [ 
    { name: "Rey Bango", id: 1 },  
    { name: "Mark Goldberg", id: 2 },  
    { name: "Jen Statford", id: 3 } ]; 

<script id="clientTemplate" type="text/html">  
    <li><${name}</li> 
</script> 

$("#clientTemplate").tmpl(clientData).appendTo("ul");

我想知道是否有可能利用jQuery's data功能，能夠將每個行項目關聯到用於更新的標識符。

通常情況下，你可以做這樣的事情：

$.each(clientData, function(idx, item) { 
    $('<li></li>').appendTo('ul#clientTemplate') 
     .text(item.name) 
     .data('clientId', item.id); 
}); 

$('ul#clientTemplate li').click(function() { 
    updateClient($(this).data('clientId')); 
});

但是你沒有這種類型的控制模板化時。

注意：我寧可不使用新的隱藏元素來存儲每行上的這些數據，或者如果我不必使用元素上的附加屬性。

想法？

感謝

來源

2011-05-07 cweston

jQuery模板插件包含tmplItem函數，該函數允許您返回與模板呈現的任何元素關聯的實際數據。

那麼，你就可以做一些事情，如：

var client = $("li").first().tmplItem().data

在這種情況下client將是你的數據：

{ name: "Rey Bango", id: 1 }

樣品在這裏：http://jsfiddle.net/rniemeyer/fvhj4/

來源

2011-05-07 01:20:35

謝謝，這是什麼我在尋找。 – cweston 2011-05-07 13:40:49

這可能是一個解決辦法：

$("#clientTemplate").tmpl(clientData).filter("li").each(function(i){ 
    $(this).data(clientData[i].id); 
}).appendTo("ul");

希望這有助於。乾杯

來源

2011-05-07 00:33:57

jQuery的模板 - 關聯數據模板的DOM元素

回答

相關問題