JQuery 属性循环答案

【问题标题】：JQuery attribute loopJQuery 属性循环
【发布时间】：2013-11-08 15:26:18
【问题描述】：

我有一个 JQuery 脚本，当我点击一个链接时，它会给我一个引导弹出图像。弹出框有效，我得到了一个漂亮的图像，但我有很多记录，它一遍又一遍地给我同样的图片。

我做错了什么？

谢谢！

HTML：

<td><a class='smoel_opvragen test' id='resources/img/smoelenboek/1.jpg' target='_blank'>Surname, Firstname</a></td>
<td><a class='smoel_opvragen test' id='resources/img/smoelenboek/3.jpg' target='_blank'>Surname, Firstname</a></td>
<td><a class='smoel_opvragen test' id='resources/img/smoelenboek/4.jpg' target='_blank'>Surname, Firstname</a></td>
<td><a class='smoel_opvragen test' id='resources/img/smoelenboek/5.jpg' target='_blank'>Surname, Firstname</a></td>

JavaScript：

$(function () {
    $(".test").popover({
        title: 'Profielfoto',
        content: "<img src='" + $(".smoel_opvragen").attr("id") + "' width='150px'>",
        html: true
    })
});

【问题讨论】：

您正在尝试查询尚不存在的元素。将脚本移动到正文的底部。
你有很多同一个类的链接？
我有，JQuery 脚本在页脚中。
点击时是否应该出现弹出框？正如您所拥有的，它似乎会在文档加载时为每个 .test 加载一个弹出框。似乎每个链接都需要一个单击事件处理程序。添加了答案。
是的，它应该，而且效果很好，它只是图片的循环......

标签： jquery twitter-bootstrap popover

【解决方案1】：

我相信您需要迭代这些项目，因为配置取决于项目：

$(".test").each(function () {
    $(this).popover({
        title: 'Profielfoto',
        content: "<img src='" + this.id + "' width='150px'>",
        html: true
    });
});

此外，id 是一个奇怪的地方来存储 url。我会使用data- 属性，例如data-image-url。

【讨论】：