Jquery附加多个具有特定div属性的标签

发布于 2024-12-23 09:21:06 字数 815 浏览 1 评论 0原文

我正在使用 jquery 构建一些 html，最终代码应如下所示：

<div id="uploaded">
  <div class="thumbs">
    <img src="http://www.example.com/image.jpg" />
    <div class="delete-pic">delete</div>
  </div>
</div>

因此 div id“uploaded”在源中硬编码，其余部分（.thumbs、img、.delete-pic）将使用 jquery 插入，

因此我使用以下 jquery 代码来完成这项工作：

$('<div class="thumbs"></div>').appendTo('#uploaded');
$('<img />').attr("src", thumb_url).appendTo('.thumbs');
$('<div></div>').attr("class", "delete-pic").appendTo('.thumbs').text("delete");

这工作正常，除了可能有未知数量的 div.thumbs 作为 div#uploaded 的子级。因此上面的 jquery 会将同一标签块附加到当前屏幕上的所有 div.thumbs 中。

我在想是否为每个 div.thumbs 生成一个随机 id，然后使用该 id 附加到图像和 div.delete-pic

但也许有一些更简单的解决方案？

原文

I'm using jquery to build some html and the final code should look like this:

<div id="uploaded">
  <div class="thumbs">
    <img src="http://www.example.com/image.jpg" />
    <div class="delete-pic">delete</div>
  </div>
</div>

so div id "uploaded" is hard coded in the source, the rest(.thumbs, img, .delete-pic) will be inserted using jquery

so i use the following jquery code to do the job:

$('<div class="thumbs"></div>').appendTo('#uploaded');
$('<img />').attr("src", thumb_url).appendTo('.thumbs');
$('<div></div>').attr("class", "delete-pic").appendTo('.thumbs').text("delete");

this works fine, except that there could be an unknown number of div.thumbs as children of div#uploaded. so the above jquery will appendto the same block of tags into all div.thumbs that are currently on screen.

I was thinking if generating a random id for each div.thumbs and then using that id to appendto the images and div.delete-pic

but maybe there is some easier solution?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

鸠魁 2024-12-30 09:21:06

为什么不在内存中创建“拇指”，然后添加您需要的内容，然后追加。像这样：

var tempthumb = $('<div class="thumbs"></div>');
$('<img />').attr("src", thumb_url).appendTo(tempthumb);
$('<div></div>').attr("class", "delete-pic").appendTo(tempthumb).text("delete");
$('#uploaded').append(tempthumb);

Why not create the "thumbs" in memory, then add what you need, then append. like so:

var tempthumb = $('<div class="thumbs"></div>');
$('<img />').attr("src", thumb_url).appendTo(tempthumb);
$('<div></div>').attr("class", "delete-pic").appendTo(tempthumb).text("delete");
$('#uploaded').append(tempthumb);

回复收藏 0 原文

~没有更多了~