0

クラス「アクティブ」で最も近い5つの「リ」（2、3、4、5、6）を見つけて選択する方法を探しています。

<li class="one">Hello</li>
<li class="two">Hello</li>
<li class="three">Hello</li>
<li class="four active">Hello</li>
<li class="five">Hello</li>
<li class="six">Hello</li>
<li class="seven">Hello</li>
<li class="eight">Hello</li>

ありがとう ：）

4

5 に答える 5

2

これを試して：

var $a = ​$( ".active" ),
    $all = $a.​​​​​​siblings().andSelf(),
    i = $all.index( $a ),
    i0 = i < 2 ? 0 
    : i + 5 > $all.length ? $all.length - 5 : i - 2;
    $five = $all.slice( i0, i0 + 5 );

$fiveはあなたのコレクションです。

于 2012-10-11T00:15:13.940 に答える
2

index次のsliceメソッドを使用できます。

var $li = $('li');
var ind = $li.filter('.active').index(); 
if ( ind-2 < 0 ) ind = 0;

$li.slice(ind-2, ind+3);

http://jsfiddle.net/dc8Xu/

于 2012-10-11T00:05:41.417 に答える
0

5 つの結果が必要な場合:

var length = $('li').length;
var start = $('.active').index() - 2;
start = start + 5 > length ? length - 6 : start;
start = start < 0 ? 0 : start;
var result = $('li').slice(start, start + 5);

するべきです。

于 2012-10-11T00:31:47.400 に答える
0

私が今までに与えた中で最も美しいコードサンプルではありません...しかし、トリックを行います:)

var activeItem = $('li.active');

activeItem.prev('li').addClass('active').prev('li').addClass('active');
activeItem.next('li').addClass('active').next('li').addClass('active');

ここでは、チェーンと呼ばれる jQuery の機能を利用しています。これは、私が使用した関数が、アクションが実行されたオブジェクト自体を実際に返すことを意味します。したがって、addClass()関数は実際に、クラスを追加した項目を返します。これにより、関数を一緒に「チェーン」することができます。

実際の動作はこちら

参照 -

于 2012-10-11T00:05:30.487 に答える
0

一行の答え

$('li.active').prevAll().andSelf().slice(-3).add('li.active + *').add('li.active + * + *').css('color','red');

説明: まず、アクティブなアイテムの前にあるすべての要素を取得してから、アクティブprevAllなアイテム自体を追加し、最後の 3 つのアイテムのみをslice関数で返します。特別なセレクターを含む関数の後li.activeにアイテムを追加しますadd+

デモ

于 2012-10-11T00:45:34.020 に答える