检测页面跳转到特定元素ID

Question

用户执行某种操作后，页面将重新加载，并在URL中添加#someId ，因此该URL将类似于localhost/panel/mypage.php#someId ，作为默认操作，浏览器将跳至带有以下内容的元素someId的ID。

我想做的是使用jQuery捕获该错误，然后直接跳到#someId元素上方，而不是直接跳转到#someId元素，并具有添加平滑滚动的功能。

那可能吗？

Answer 1

正是“窗口”文档对象的hashchange事件，这正是捕获此行为所需的条件。 您可以使用：

1. JavaScript解决方案：

    window.addEventListener('hashchange', function(){ // smooth scroll code }); 

2. jQuery解决方案（v1.8 +）：

    jQuery(window).on('hashchange', function(){ // smooth scroll code }); 

注意： hashchange事件是在同一页面上的URL哈希更改（location.hash）上触发的，而不是在不同页面上触发的，例如从www.example.com/about.html#first转到www.example.com/contact.html #second不会触发hashchange事件。

Answer 2

这应该使您开始：

var a_hash = window.location.hash;
var offset = $(a_hash).offset();
if(offset.top > 100){
    offset.top = offset.top - 100;
}
var body = $("html, body");
body.animate({scrollTop: offset.top}, '500', 'swing', function() { 

});