1

我有一个包含链接的列表。在此列表之前是另一个链接，这是 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);
        }
    });

});

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

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

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

4

5 回答 5

1

无需使用第 n 个孩子。

我不明白您是否要重置图像计数，所以这里没有重置：

$(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/

于 2013-09-16T09:36:46.373 回答
0

您可以利用 jQuery 的index()方法。http://api.jquery.com/index/

这是 jsFiddle 的更新：http: //jsfiddle.net/ArtBIT/Dyfe6/4/

于 2013-09-16T09:36:28.480 回答
0

这可能不是最好的方法，但我已经这样做了：

    var pre = $('.catItemImage').children('a').attr('href');
    var links = $('.sigProBetton li a'),count=1;
    $(links).each(function() {
        $(this).attr('href',pre+'?image='+count);
        count += 1;
    });
于 2013-09-16T09:38:24.350 回答
0

更新

 $(document).ready(function () {


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

   });
 });

在这里摆弄

于 2013-09-16T09:41:59.717 回答
0

使用:first-child而不是:nth-child(1)

于 2013-09-16T09:45:16.853 回答