0

今年を最初のnav要素にすることで、jQueryを使用してナビゲーションを構築する必要があります。次に、他のリストアイテムを作成して、次の年を表示します...私の問題は、jQuery関数内のリストアイテムの兄弟をターゲットにすることです。これにより、複数のページでその関数を簡単に実行できます...ここに私がこれまでに持っているものです...それがちょうどそれを要求するのを助けるならば、私はフィドルをセットアップすることができます。

これは成功した/機能しているコードですが、jQuery関数でラップされていません:

$currentYear = (new Date).getFullYear();
$navListEl = $("#yearNav li").length; // = 7
$lastYear=0;
for (var i=1;i<$navListEl+1;i++)
{  
    $("#yearNav li"+":nth-child("+i+")").append($currentYear-$lastYear);
    $lastYear++;
}

初挑戦:

jQuery.fn.createNav = function(){
    $currentYear = (new Date).getFullYear();
    $navListEl = $(this).length; // = 7
    alert('hey');
    $lastYear=0;
    for (var i=1;i<$navListEl+1;i++)
    {  
        $(this+":nth-child("+i+")").append($currentYear-$lastYear);
        $lastYear++;
    }
}

$("#yearNav li").createNav();

2回目の試行:(これはちょっと動作しますが、各liアイテムに1回ではなく、各liアイテムのnmberを複製します)

jQuery.fn.createNav = function(){
    $currentYear = (new Date).getFullYear();
    $navListEl = $(this).length; // = 7
    $lastYear = 0;
    for (var i=1;i<$navListEl+1;i++)
    {  
        $(this).append($currentYear-$lastYear);
        $lastYear++;
    }
}

$("#yearNav li").siblings().createNav();
4

2 に答える 2

1

試す

$(this.selector+":nth-child("+i+")").append($currentYear-$lastYear);
于 2013-01-09T05:31:54.090 に答える
1

Musaの答えの代わりに、すべての要素に対してセレクターを再実行することを避けたい場合は、次の2つのアプローチのいずれかを使用して、選択した要素のリストを1回だけ繰り返すことができます。

  1. forループのメソッドを使用してeq()、インデックスでリスト内の各要素にアクセスします。

    jQuery.fn.createNav = function(){
        $currentYear = (new Date).getFullYear();
        $navListEl = $(this).length; // = 7
        $lastYear = 0;
    
        for (var i = 0; i < $navListEl; i++)
        {
            $(this).eq(i).append($currentYear - $lastYear);
            $lastYear++;
        }
    }
    
  2. このメソッドを使用して、each()各要素を順番に繰り返します。

    jQuery.fn.createNav = function(){
        $currentYear = (new Date).getFullYear();
        $navListEl = $(this).length; // = 7
        $lastYear = 0;
    
        $(this).each(function(){
            $(this).append($currentYear - $lastYear);
            $lastYear++;
        });
    }
    
于 2013-01-09T05:52:51.173 に答える