JQuery - Количество элементов в списке

Question

Я хотел бы число пункта в моем списке должны быть пронумерованы от 10 -> 0

У меня есть следующий код:

<ul class="StoryBoard" id="StoryBoard"> 
{#storylines} 
<li>{text|bl|s}</li>  
{/storylines} 
</ul> 

пример того, как это сделало бы в браузере будет:

<ul class="StoryBoard" id="StoryBoard"> 
<li>Test</li> 
<li>Test</li> 
<li>Test</li> 
<li>Test</li> 
</ul> 

Однако я хотел бы его, чтобы сделать так:

<ul class="StoryBoard" id="StoryBoard"> 
<li>Test (10)</li> 
<li>Test (9)</li> 
<li>Test (8)</li> 
<li>Test (7)</li> 
</ul> 

Там всегда будет максимум 10 пунктов

Answer 1

Поскольку вы используете dustjs, у вас есть доступ к @idx помощника при переборе:

{#storylines} 
<li>{text|bl|s} ({@idx}{.}{/idx})</li>  
{/storylines} 

От dustjs docs:

IDX тег проходит числовой индекс из текущий элемент к закрытому блоку.

EDIT: Я недостаточно внимательно изучил ваш вопрос - похоже, что вы ищете убывающий счет. вспомогательный помощник idx будет подсчитывать.

EDIT AGAIN: В комментариях было задано вопрос, можете ли вы просто сделать {@idx}{10 - .}{/idx}.

Ответ на это нет, потому что пыль не оценивает произвольные выражения. Но если вы посмотрите на источник dust.helpers.idx, который где тег исходит от, это просто:

function (chunk, context, bodies) { 
    return bodies.block(chunk, context.push(context.stack.index)) 
} 

Это толкая новый контекст со значением текущего индекса итерации.Оказывается, что context.stack объект имеет атрибут of, который дает вам количество элементов в стеке, так что вы можете написать свой собственный negidx помощник:

dust.helpers.negidx = function(chunk, context, bodies) { 
    return bodies.block(chunk, context.push(context.stack.of - context.stack.index)); 
}; 

На данный момент, следующий будет сделать то, что исходный вопрос спросил:

{#storylines} 
<li>{text|bl|s} ({@negidx}{.}{/negidx})</li>  
{/storylines} 

And here's a fiddle.

Answer 2

$('#StoryBoard').find('li').each(function(i){ 
    $(this).append(' ' + (10 - i)); 
}); 

тест? : http://jsbin.com/aduqix/1/edit

Answer 3

Я хотел бы предложить:

$('#StoryBoard li').text(function(i,t) { return t + ' (' + (10 - i)+ ')'}); 

JS Fiddle demo.

анонимная функция в методе text(), имеет два параметра i (индекс текущего элемента (как это перебирает все элементов соответствуют селектору)) и t, что текст текущего элемента ,

Этот текст возвращает текущий текст после добавления скобки открытия, индекса и закрывающей скобки.

Ссылки:

• text().

Answer 4

вот демо http://jsfiddle.net/GPEth/ - в JQuery Я не уверен, если вы хотите, чтобы это исправить в пыли .js или JQuery

$(function() { 
    var $li = $('ul#StoryBoard li'), 
     count = $li.size(); 
    $li.each(function (index) { 
     $(this).text($(this).text() + (count - index)); 
    }) 
});