JQuery模板需要分配ID的

這可能已經很簡單了我只是不在正確的軌道上我敢打賭。JQuery模板需要分配ID的

我有一個JSON對象數組從我的WCF調用返回，通過JQuery AJAX調用讀取。

可以說物體看起來是這樣的：

string Name 
string BackgroundImage

所以我有一堆跨度我想在我的網頁放下的，我想給他們唯一的ID。我能夠做這種「壞」的方式由拋出一個ID爲我的JSON對象

$("#tabLink").tmpl(json.d).appendTo("#nav");

<script id="tabLink" type="text/x-jQuery-tmpl"> 
     <span id="page{$id}" class="tabLinks" style="background-image:url(${BackgroundImage}")>Tab {$id}</span> 
    </script>

我想看看：

<span id="page1" class="tabLinks" style="blahblahblah")>Tab {$id}</span> 
<span id="page2" class="tabLinks" style="blahblahblah")>Tab {$id}</span> 
<span id="page3" class="tabLinks" style="blahblahblah")>Tab {$id}</span>

來源

2011-02-24 KevinDeus

一個選項是將包含數組的對象傳遞到您的模板。然後，在您有$ index可用的模板中執行「each」，或者您可以明確地跟蹤索引和對象。

會是這樣：

<script id="tabLink" type="text/x-jQuery-tmpl"> 
     {{each items}} 
     <span id="page${$index}" class="tabLinks" style="background-image:url(${BackgroundImage}")>Tab ${$index}</span> 
     {{/each}} 
</script>

或：

<script id="tabLink" type="text/x-jQuery-tmpl"> 
     {{each(i, item) items}} 
     <span id="page${i}" class="tabLinks" style="background-image:url(${BackgroundImage}")>Tab ${i}</span> 
     {{/each}} 
</script>

而且叫這樣的：

$("#tabLink").tmpl({ items: json.d }).appendTo("#nav");

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

在將數組傳遞給.tmpl時，似乎沒有可用的$ index，否則只需使用$ index即可設置。

來源

2011-02-25 16:27:50

我發現一種方式，但它似乎有點hacky ..

之前我的.appendTo（）我可以在.js中添加一個道具，以便一個不需要WCF ..

var x = 1; 
    $.each(json.d, function (i, item) { 
     item.ID = x++; 
    });

來源

2011-02-24 21:10:33 KevinDeus

JQuery模板需要分配ID的

回答

相關問題