使用 .each() 进行 jQuery 变量迭代答案

【问题标题】：jQuery variable iteration with .each()使用 .each() 进行 jQuery 变量迭代
【发布时间】：2012-09-24 13:57:17
【问题描述】：

我的代码需要在变量中捕获图像的“src”。然后它需要将此变量插入到围绕图像的链接上的“href”标签中。

$('.fancybox-image-li img').each(function(test) {
    var test = $(this).attr("src");
    $('.fancybox-image-link').attr('href', ''+test+'');
});

不幸的是，'test' var 只是获取最后一个 img 的属性，然后将其插入到所有 'href' 属性中。

任何想法如何让每个图像的变量发生变化。

【问题讨论】：

标签： jquery jquery-selectors

【解决方案1】：

$('.fancybox-image-link') 返回该类的所有元素。您实际上是在每次循环迭代都修改它们。

改为使用.index() 来选择单个：

$('.fancybox-image-li img').each(function(index, value) {
    $('.fancybox-image-link').index(index).attr('href', $(this).attr("src"));
});

【讨论】：

【解决方案2】：

您应该更具体地使用$('.fancybox-image-link')，使用像 child ... 到 $(this) 这样的选择方法。

【讨论】：

【解决方案3】：

您的链接选择器不正确。这个$('.fancybox-image-link') 将选择该类的所有链接，因此它们都将具有相同的 href 属性。

您需要一个更具体的链接选择器。如果图像和链接都包含在同一个元素中，也许可以尝试使用父元素。

【讨论】：

【解决方案4】：

也许你应该这样做

$('.fancybox-image-li img').each(function(test) {

    var test = $(this).attr("src");
    // find the closest element with the class
    $( this ).closest('.fancybox-image-link').attr('href', ''+test+'');

});

否则在每次迭代中，您将所有$('.fancybox-image-link') 的href 设置为当前href 属性，从而得到所有$('.fancybox-image-link') 和最后一个href

【讨论】：