0

我有一个变量var $deleteEl = $('<a class="upload_delete" href="#">Delete</a>');，它是一个删除链接，需要在每个上传的图像旁边创建。接下来是html结构：

<ul id="thumb_galery">
    <li class="thumb">
        <img>
        <a class="upload_delete"></a>
    </li>
    <li class="thumb">
        <img>
        <a class="upload_delete"></a>
    </li>
</ul>

对于每个上传的图像，带有图像的拇指附加到 thumb_galery

$(thumb_galery).append('<li id="thumb"><img src="img/success.jpg" alt="' + fileName + '"></li>');

我需要li在 html 结构中提供的图像旁边添加删除链接。

如果我像这样附加删除链接

$(thumb).append($deleteEl);

它适用于上传的第一张图片，但对于下一张图片，它只会将其附加到第一张li带有拇指类的图片。

如何li为下一个上传的图像附加删除链接？

我尝试的另一个解决方案是像这样在第一个附加中放置一个变量

$(thumb_galery).append('<li class="thumb"><img src="img/success.jpg" alt="' + fileName + '">' + $deleteEl + '</li>');

这创建了完美的 html 结构，但不是删除链接，而是显示 [object Object]

4

2 回答 2

2

给元素一个唯一的id或使用一个类。并尝试：

var item = $('<li id="thumbX" class="thumb"><img src="img/success.jpg" alt="' + fileName + '"></li>');
item.append($deleteEl)
$(thumb_galery).append(item);
于 2013-04-26T18:44:28.097 回答
1

您可以像这样直接附加它，您不应该有多个具有相同 id 的元素。

http://jsfiddle.net/xq8f7/

var $deleteEl = $('<a>',{ 
    'class': "upload_delete",
    href: "#",
    text: "Delete"});
$('.thumb').append($deleteEl);
于 2013-04-26T18:41:49.957 回答