Question

我有一份产品清单。每个产品都有标题和评论链接。目前，标题直接链接到单个产品页面，评论链接转到其他位置。

我想使用jquery每个循环遍历每个li，从标题中获取href（第一个链接），并将其应用于审阅链接（第二个链接），因此它们都指向产品页面。

简化代码如下：

<ul>
   <li><a href="product1.html">Product 1</a><a href="review1.html">Review 1</a></li>
   <li><a href="product2.html">Product 2</a><a href="review2.html">Review 2</a></li>
   <li><a href="product3.html">Product 3</a><a href="review3.html">Review 3</a></li>
</ul>

我认为它会如下所示：

$("li").each(function(){
   var link = $("a:eq(0)").attr('href');
   $("a:eq(1)").attr("href", link);
});

但它总是使用相同的变量“link”。

有人能帮助我吗？

Answer 1

我传递this作为参数来定义each()循环的每次迭代的上下文。在每次迭代中，this引用相关元素。

$("li").each(function(){
   var link = $("a:eq(0)", this).attr('href');
   $("a:eq(1)", this).attr("href", link);
});

Answer 2

$("li").each(function(){
   var link = $(this).find("a:eq(0)").attr('href');
   $(this).find("a:eq(1)").attr("href", link);
});

Answer 3

避免必须完全使用.each的另一个选项是将函数作为第二个参数传递给.attr。

其工作原理如下：

$('li').find('a:nth-child(2)').attr('href', function(index, href) {
    return $(this).prev('a').attr('href'); // use previous sibling's href
});

基本上，它将使每个元素与选择器匹配，将其传递给函数，然后将href属性设置为该函数的结果。该函数将被传递参数：第一个是匹配集中的索引（此处为$('li a:nth-child(2)')），第二个是属性的当前值。在您的特定情况下，您也不关心，但通常您会希望根据其当前值转换属性，因此它可以很方便。

使用哪一个完全是品味问题，jQuery集允许你做很多事情，而不必直接使用.each。

Answer 4

这是因为您没有使用li作为a选择的上下文：

试试这个：

$("li").each(function(){
    var a = $('a',this);
    var link = a.filter(":eq(0)").attr('href');
    a.filter(":eq(1)").attr("href", link);
});

Answer 5

尝试：

 $("li").each(function(){
    var link = $("a:eq(0)", this).attr('href');
 $("a:eq(1)", this).attr("href", link);
  });

jQuery每个循环 - 使用变量

5 个答案: