jQuery每個循環 - 使用變量

Question

我有一個產品列表。每個產品都有一個標題和一個評論鏈接。目前，這些標題直接鏈接到各個產品頁面，並且評論鏈接轉到其他地方。

我想使用jquery each循環遍歷每個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); 
}); 

但它總是使用相同的變量「鏈接」。

有人可以幫我嗎？

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

它，因爲你不使用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 4

嘗試：

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

Answer 5

另一種選擇，避免必須完全使用.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。