javascript - JQuery 获取链接并根据第 n 个数字添加变量

Question

我设置了一个包含链接的列表。在此列表之前是另一个链接，这是 html:

<div class="catItemBody">
    <div class="catItemImage">
        <a href="index.html">Link</a>
    </div>
    <ul class="sigProBetton">
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
    </ul>
</div>

<div class="catItemBody">
    <div class="catItemImage">
        <a href="index2.html">Link</a>
    </div>
    <ul class="sigProBetton">
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
    </ul>
</div>

页面上有多个.catItemBody，每个都包含一个唯一的链接。

我还有一些 jquery，它获取第一个链接 (.catItemImage a) 并将其应用于列表中的每个链接。我要做的是根据第 n 个列表项修改此链接。我一直在使用以下 jQuery 试验第一个链接项:

$(document).ready(function() {

    $('.catItemBody').each(function(){
        var linkitem = $('.catItemImage a', this).attr('href');
        if ($('ul.sigProBetton li').is(':nth-child(1)')){
            $('ul.sigProBetton li a', this).attr('href' , linkitem+'?image=1'); 
        } else {
            $('ul.sigProBetton li a', this).attr('href' , linkitem);
        }
    });

});

最终我想以此为基础，使第一项中的链接具有 URL 变量 ?image=1，然后第二项将具有 ?image=2 等...我需要重新设置“计数”下一个 .catItemBody 中的列表将再次从 ?image=1 开始。

目前，每个链接都有变量 ?image=1，这并不理想。我在 http://jsfiddle.net/Dyfe6/ 设置了一个 jsFiddle .

编辑 您所有的答案似乎都有效，但问题是我在页面上有多个 .catItemBody，可以在 http://jsfiddle.net/Dyfe6/9/ 找到更新的 jsfiddle

Answer 1

无需使用第 nth-child。

我不明白你要不要重置图片数，所以这里不重置:

$(document).ready(function () {
    var count = 0;
    $('.catItemBody').each(function () {
        var linkitem = $(this).find('.catItemImage a').attr('href');
        $(this).find('ul.sigProBetton li').each(function () {
            count++;
            $(this).find('a').attr('href', linkitem + '?image=' + count);
        });

    });
});

jsFiddle:http://jsfiddle.net/Dyfe6/11/

这里是重置的:

$(document).ready(function () {
    $('.catItemBody').each(function () {
        var linkitem = $(this).find('.catItemImage a').attr('href');
        $(this).find('ul.sigProBetton li').each(function (index) {
            $(this).find('a').attr('href', linkitem + '?image=' + (index + 1));
        });

    });
});

http://jsfiddle.net/Dyfe6/12/