Jquery 如何根据相应元素的单击将div滚动到特定点？

我正在尝试微调应用程序的UI，实际上有两个列表（listA和listB）。。。列表A具有超链接，单击后，该超链接会自动将listB滚动到listB中特定的对应元素。现在我决定只滚动到元素的上边缘，但理想情况下它会滚动，使项目位于listB的中心（垂直）

这里有一把小提琴，显示了我的尝试，它在第一次点击时就起作用，但任何后续点击都会产生不稳定的结果：

我相信我的问题与fiddle示例中的这行代码有关——我试图在其中完成滚动：

$('#listingB').animate({ 
scrollTop: (($('#listingB_item_' + $(this).data('num')).offset().top - $("#listingB").offset().top) )
}, 'slow');

---

如何才能使此工作正常，使每次单击都会导致列表B滚动到相应的项目？

使用一个锚定，并将href设置为

#idofdivyouwanttoscrolltto

<a href="#yourDivId">This link will scroll to the div</a>

<div id="yourDivId">Hello</div>

你好

：工作代码

第一个问题是，第二次单击时变为顶部是因为如果是连续第二次单击，则需要取消该行为。您还需要向动画值添加

$（“#listingB”）.scrollTop（）

值，因为一旦在B列表中滚动，您的计算将无法按预期工作。laslty，如果需要显示元素的中心，则应计算其高度，并将该值的一半添加到scrollTop。以下是您应该如何做到这一点：

var i;
var clicked;
for(var i = 0; i < 200; i++) {
    $('#listingB').append('<div id="listingB_item_' + i +'" class="items" data-num="'+ i +'"></div>');
    $('#listingB_item_' + i).html('item number ' + i);

    $('#listingA').append('<div id="listingA_item_' + i +'" class="items1" data-num="'+ i +'"></div>');
    $('#listingA_item_' + i).html('item number ' + i);
}

$('.items1').click( 
    function() {
        if($(this).data('num') != clicked)
        {
            clicked = $(this).data('num');
            $('#listingB').animate({scrollTop: (($('#listingB_item_' + $(this).data('num')).offset().top - $("#listingB").offset().top) + $("#listingB").scrollTop() + ((parseInt($(".items").css("padding-top")) + parseInt($(".items").css("height"))) / 2) + 'px' )}, 'slow');
        }
    }
);

vari；
var单击；
对于（变量i=0；i<200；i++）{
$（'#listingB'）。附加（''）；
$（'#listingB_item_u'+i）.html（'项目编号'+i）；
$（'#listingA'）。附加（''）；
$（'#listingA_item_'+i）.html（'项目编号'+i）；
}
$（'.items1'）。单击（
函数（）{
如果（$（this）.data（'num'）！=单击）
{
单击=$（this.data（'num'）；
$（'#listingB'）。动画（{scrollTop:（$（'#listingB#u item_'+$（this.data（'num'））.offset（）.top-$（“#listingB”）.offset（）.top）+$（“#listingB”）.scrollTop（）+（（parseInt（$（.items”）.css（“padding top”）+parseInt（$（.items”）.css”）.css（“height”）/2）+“px”），“slow”）；
}
}
);

这将阻止所需的滚动动画。哦，您正在寻找慢速滚动。很抱歉，我错过了问题的那一部分，我想建议这一点，我在过去使用过它，它可以满足您的需要，您可以进入您希望滚动到的div，动画看起来很不错