我有一份问题清单。当我点击第一个问题时,它会自动把我带到页面底部的特定元素。

我如何用jQuery做到这一点?


当前回答

jQuery不是必需的。我从谷歌搜索中得到的大多数结果都是这样的答案:

window.scrollTo(0, document.body.scrollHeight);

在有嵌套元素的地方,文档可能无法滚动。在这种情况下,您需要以滚动的元素为目标,并使用其滚动高度。

nestedElement.scrollTo(0, nestedElement.scrollHeight);

你可以参考一些其他的来源:

http://www.alecjacobson.com/weblog/?p=753 http://www.mediacollege.com/internet/javascript/page/scroll.html http://www.electrictoolbox.com/jquery-scroll-bottom/

其他回答

我放弃了滚动,而是尝试了锚定方法:

<a href="#target_id_at_bottom">scroll to the bottom</a>

伴随着这个CSS魅力:

html,
body {
    scroll-behavior: smooth;
}

祝你有愉快的一天!

滚动整个页面到底部:

const scrollingElement = (document.scrollingElement || document.body);
scrollingElement.scrollTop = scrollingElement.scrollHeight;

你可以在这里查看演示

将一个特定的元素滚动到底部:

const scrollToBottom = (id) => {
    const element = document.getElementById(id);
    element.scrollTop = element.scrollHeight;
}

下面是演示

它是这样工作的:

参考:scrollTop, scrollHeight, clientHeight

更新:最新版本的Chrome(61+)和Firefox不支持滚动正文,请参阅:https://dev.opera.com/articles/fixing-the-scrolltop-bug/

jQuery不是必需的。我从谷歌搜索中得到的大多数结果都是这样的答案:

window.scrollTo(0, document.body.scrollHeight);

在有嵌套元素的地方,文档可能无法滚动。在这种情况下,您需要以滚动的元素为目标,并使用其滚动高度。

nestedElement.scrollTo(0, nestedElement.scrollHeight);

你可以参考一些其他的来源:

http://www.alecjacobson.com/weblog/?p=753 http://www.mediacollege.com/internet/javascript/page/scroll.html http://www.electrictoolbox.com/jquery-scroll-bottom/

我也遇到过同样的问题。对于我来说,在一个时间点上,div的元素没有完全加载,scrollTop属性是用scrollHeight的当前值初始化的,这不是scrollHeight的正确结束值。

我的项目在Angular 8中,我所做的是:

我使用viewchild来获取.ts文件中的元素。 我已经继承了AfterViewChecked事件,并在那里放置了一行代码,其中声明viewchild元素必须将scrollTop值的值scrollHeight (this.viewChildElement.nativeElement。scrollTop = this.viewChildElement.nativeElement.scrollHeight;)

AfterViewChecked事件触发了几次,它最终从scrollHeight中获得了正确的值。

你可以试试Gentle Anchors,一个不错的javascript插件。

例子:

function SomeFunction() {
  // your code
  // Pass an id attribute to scroll to. The # is required
  Gentle_Anchors.Setup('#destination');
  // maybe some more code
}

兼容性测试对象:

Mac Firefox, Safari, Opera Windows Firefox, Opera, Safari, Internet Explorer 5.55+ Linux未经测试,但至少Firefox应该没问题