jquery - 滚动到元素

Question

如何确定文本标签与单击的元素匹配的元素的索引号？

我有一个清单：

<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 时，我的屏幕需要在页面稍后向下滚动到匹配的 DIV 之一。

$('#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);
});

Answer 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);