0

テキストラベルがクリックされたものと一致する要素のインデックス番号を確認するにはどうすればよいですか？

私はリストを持っています：

<ul>
  <li data-cont="item one">this is one</li>
  <li data-cont="item 2">this is second</li>
  <li data-cont="one more">this is another one</li>
</ul>

...

<div>item one</div>

<div>item 2</div>

<div>one more</div>

LIの1つがクリックされると、画面はページの後半で一致するDIVの1つまでスクロールダウンする必要があります。

$('#li').click(function(){
    var scrollNow = $(this).attr('data-cont');
    $('html, body').animate({
        scrollTop: $( 

        // here I need to scroll down to the item by index...

        ).offset().top
    }, 500);
});
4

1 に答える 1

1

divのインデックスを取得するのは簡単です：

var index = $('div').filter(function(){
   return $(this).text().trim()==scrollNow}
).index();

（:containsあまりにも多くのdivに一致する可能性があるため、使用しません）

しかし、なぜこのインデックスが必要なのかわかりません。

divまでスクロールしたい場合は、次のことを行う必要があります。

var div = $('div').filter(function(){
   return $(this).text().trim()==scrollNow}
);
$('html, body').animate({
    scrollTop: div.offset().top
}, 500);
于 2012-11-08T20:20:09.023 に答える