Question

我希望列表中的项目编号从10开始编号 - ＆gt; 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标记将当前元素的数字索引传递给随附的块。

编辑：我没有仔细阅读你的问题 - 看起来你正在寻找降序数。 idx助手会计算在内。

再次编辑：在评论中询问您是否可以{@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 li').text(function(i,t) { return t + ' (' + (10 -  i )+ ')'});

JS Fiddle demo

text()方法中的匿名函数有两个参数i（当前元素的索引（因为它迭代 all 选择器匹配的元素））和t，这是当前元素的文本。

然后，在追加开括号，索引和右括号后返回当前文本。

参考文献：

text()。

Answer 3

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

测试？：http://jsbin.com/aduqix/1/edit

Answer 4

这是一个演示http://jsfiddle.net/GPEth/ - 在jQuery中我不确定你是否想要在dust.js或jQuery

中修复此问题

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

JQuery - 列表中的数字项

4 个答案: