1

私は以下のいくつかのコードを持っています:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){

   var index=5;  
   $("ul li:last").addClass(function(index) {
    console.log(index);  
    return "item-" + index;
   });

});
</script>
</head>
<body>

<ul>
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li> 
</ul>

</body>
</html>

そして、関数(インデックス)がはっきりとわかります。しかし、私はそれが何をしているのか理解できません。新しいリストが作成されると、最後のliのクラスはitem-0になります。変数index=5を設定しようとしましたが、渡すことができません(item-0ではなくitem-5にすることを望んでいます)では、function(index)のインデックスは、ゲッターセッターですか、それとも何ですか?

4

3 に答える 3

2

セレクターが:last liを選択し、選択されている要素が1つしかないため、これindexはjQueryコレクションで選択された要素のインデックスです。インデックスは0です。

.addClass( function(index, currentClass) )

インデックスに基づいてクラスを変更する場合は、:lastセレクターを削除できます。

 $("ul li").addClass(function(index) {
    console.log(index);  
    return "item-" + index;
 });

または、最後の要素を選択し、そのインデックスに基づいてクラスを追加する場合は、次のことを試すことができます。

var $lst = $("ul li:last");
var ind = $lst.index();
$lst.addClass('item-'+ind)

インデックスはゼロベースであり、最初に選択された要素のインデックスは0であることに注意してください。

于 2012-09-21T19:29:53.250 に答える
0

indexはあなたの場合の引数であり、関数に渡すことはできません。:lastは、最後のLIのみに制限されます。これは:lastを使用しない例です。これにより、各liにインデックスがitem-nどこにあるかのクラスが与えられます。n

$(document).ready(function(){

   $("ul li").addClass(function(index) {
    console.log(index);  
    return "item-" + index;
   });

});
于 2012-09-21T19:32:24.247 に答える
0

あなたがやろうとしているのは、リストの最後の要素を選択し、前の要素の数に基づいてクラスを与えることだと思いますだから、これを試してみてください:

$(document).ready(function(){
   var lis = $("ul li");
   $(lis[lis.length-1]).addClass("item-" + (lis.length + 1));
});

http://jsfiddle.net/P7gRP/

あなたの例がうまくいかない理由は、1つの要素だけがli:lastに一致するからです(もちろん)。したがって、あなたのケースで現在一致している要素のインデックスはゼロです。すべての要素にitem-#のクラスを設定したい場合は、正しい方向に進んでいます。このような:

$("ul li").addClass(function(index) {
    return "item-" + index;
   });

:last部分を削除したことに注意してください。

于 2012-09-21T19:35:38.537 に答える