将每个图像包装在一个 div 中并在前面加上一个数字答案

【问题标题】：wrap each image in a div and prepend a number将每个图像包装在一个 div 中并在前面加上一个数字
【发布时间】：2014-04-07 01:25:31
【问题描述】：

我正在尝试编写一个函数来将每个图像包装在一个 div 中，然后为每个图像插入一个带有标签的跨度。

这是我目前所写的：

$('#carousel img').each(function(index) {
  $(this).wrap('<div class="image"></div>');
  $(this).before(function (index) {
    index = '00' + (index + 1);
    return '<span class=index>' + index.substr(index.length - 2) + '</span>';
  });
});

我的代码实际上是这样做的，注意 数字问题 并将 span 放在 img 标签内：

<div class="image">
  <img src="img/ny1.jpg" />
    <span class="index">01</span>   
  </img>
</div>

<div class="image">
  <img src="img/ny2.jpg" />
    <span class="index">01</span>   
  </img>
</div>

想要的结果：

从这里：

<img src="img/ny1.jpg" /> <img src="img/ny2.jpg" />

到这里：

<div class="image">
<span class="index">01</span>   
<img src="img/ny1.jpg" />
</div>

<div class="image">
<span class="index">02</span>   
<img src="img/ny1.jpg" />
</div>

谢谢

【问题讨论】：

你遇到的问题是......？
问题是它把 span 放在了 img 包装器中

标签： jquery html image

【解决方案1】：

如果您遇到的问题与编号有关（因为我没有发现其他错误），请从 $(this).before(function (index) { 中删除 index

jsFiddle example

【讨论】：