动态加载图像并使用jQuery添加ID属性

Question

我在每个无序列表标记之间动态加载图像。我现在想为动态加载的每个图像添加一个唯一的id。我相信问题是jQuery无法遍历图像，因为图像是动态加载的？所以我尝试迭代无序列表标签，然后将生成的索引（i）号码作为相应的图像ID，但这也不起作用。

jQuery的：

var img = $("<img />"), li = $('li');

li.append(img);

li.each(function(i){
    img
    .attr( "id", i )
    .attr("src", "img/" + i + ".png")
    .attr("alt", "image" + i);
});

HTML：

<ul>
<li><!--<img id="01" src="img/01.png" alt="image01/>--></li>
<li><!--<img id="02" src="img/02.png" alt="image02"/>--></li> 
<li><!--<img id="03" src="img/03.png" alt="image03"/>--></li> 
<li><!--<img id="04" src="img/04.png" alt="image04"/>--></li> 
....
</ul>

Answer 1

您需要更改代码：

var li = $('ul li');
li.each(function (i) {
    var img = $("<img />");
    img.attr({
        "id": i,
        "src": "img/" + i + ".png",
        "alt": "image" + i,
    });
    $(this).append(img);
});

演示：http://jsfiddle.net/lotusgodkk/GCu2D/150/

您可以同时传递所有属性，而不是单独传递。