2011-06-06 24 views
0

嗨,我有一個jsonlist對象,我把它發送到模板。我想發送項目的索引getSurname方法從json對象中獲取項目。那麼我怎樣才能得到jsonList的項目索引?JQuery模板 - 獲取索引的JSONList

我的模板:

$.template('deneme', 
'<div>${name}: <input onClick='getSurname(\"${$index}\")' 
    type='checkbox' /></div> 

的json列表:在這一個

[{"name":"Sedat","surname":"Basar"}, 
{"name":"Deneme","surname":"Avile"}, 
{"name":"Ganmaz","surname":"Oyilmna"}] 

function getSurname(){ 
....??? 
} 

回答

0

兩個想法:

1,而不是讓你的陣列的每個項目模板運行,您可以將整個數組傳遞給模板並更好地訪問索引/項目信息。

var data = [{"name":"Sedat","surname":"Basar"}, 
{"name":"Deneme","surname":"Avile"}, 
{"name":"Ganmaz","surname":"Oyilmna"}]; 

$("#deneme").tmpl({ people: data }).appendTo("#content"); 

<script id="deneme" type="text/html"> 
    {{each(i, person) people}} 
    <div> 
     ${name}: <input onClick='getSurname("${i}")' type='checkbox' /> 
    </div> 
    {{/each}} 
    <hr /> 
</script> 

2-另一種替代方法是使用模板插件的tmplItem功能。這看起來是這樣的:

var data = [{"name":"Sedat","surname":"Basar"}, 
{"name":"Deneme","surname":"Avile"}, 
{"name":"Ganmaz","surname":"Oyilmna"}]; 

function getSurname(element){ 
    var data = $(element).tmplItem().data; 
    alert(data.surname); 
} 


$("#deneme").tmpl(data).appendTo("#content"); 

<script id="deneme" type="text/html"> 
    <div> 
     ${name}: <input onClick='getSurname(this)' type='checkbox' /> 
    </div> 
</script> 

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

+0

謝謝尼邁耶 – 2011-06-07 06:09:50