jQuery(".element").scrollTop(0); doesn't work

本文关键字：quot work doesn element jQuery scrollTop 更新时间：2023-09-26

我有多个这样的标签:

[tab 1] [tab 2]

,内容

[tab 1] [tab 2]

HTML:

<div class="tabs">
    <ul class="tab-links">
        <li class="active"><a href="#tab1">Tab #1</a></li>
        <li><a href="#tab2">Tab #2</a></li>
    </ul>  
    <div class="tab-content">
        <div id="tab1" class="tab active">#1 content</div>
        <div id="tab2" class="tab">#2 content </div> 
    </div>
    <div class="tabs">
        <ul class="tab-links">
            <li class="active"><a href="#tab1">Tab #1</a></li>
            <li><a href="#tab2">Tab #2</a></li>
        </ul>
    </div>
</div>

正如你所看到的，在tab-content的上面和下面都有一个tab列表。

只要内容很长，用户在更改选项卡列表底部的选项卡时必须向上滚动到页面。

所以，当用户从下面更改选项卡时，我想自动滚动顶部。我将jQuery(".tab-content").scrollTop(0);添加到java脚本代码中。但不知怎么的，它没有回应。

jsFiddle:

http://jsfiddle.net/4m2ut16k/8/

注意:当我将jQuery(".tab-content").scrollTop(0);更改为jQuery(window).scrollTop(0);时，它会起作用，但这不是我想要的，因为我的内容不在页面顶部。

就是不明白为什么它一开始就不起作用。有人查出是什么问题了吗?

你需要将窗口滚动到标签容器的顶部，你可以使用jquery offset函数获得.tab-content元素的偏移量，然后获得顶部属性:

jQuery(window).scrollTop(jQuery(".tab-content").offset().top);