Question

我在顶部有一个带有粘性菜单栏的页面。此页面上有一些内部链接。当我点击内部链接时，页面滚动和具有哈希码id的元素移动到顶部。但标题隐藏在粘性菜单中。所以在窗口加载时我写了js代码，见下文：

if(window.location.hash) {
        var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
        console.log (hash);
        if(hash && $("#"+hash).length){
            $("#"+hash).css('padding-top', '80px');
        }
        $(window).scroll(function() {
            $("#"+hash).css('padding-top', '0');
        });
    }

当页面加载hashcode url时，它的工作正常。

问题是当用户点击地址栏而没有改变任何东西时按回车键，那么id为hashcode agian的元素会移到顶部，这次我的js代码没有运行，标题隐藏在粘性菜单中。

当地址栏聚焦并按下回车键时，有没有办法检测到这个事件？

或者这种情况还有其他解决办法吗？

谢谢，

Answer 1

我通过以下逻辑找到了一个简单的解决方案。请注意，我目前还不完全知道在哪个其他情况下触发了window对象中的'focus'事件。如果我遇到副作用，我会更新我的帖子。

据我所知，Chrome会执行整页加载，而Firefox只会执行您的描述所说的内容。因此，在重新加载页面之前，Chrome中的焦点事件将被触发，这应该在您的实现中考虑。（我在'DOMContentLoaded'中也有重新定位逻辑，所以这种情况对我来说没问题）

window.addEventListener('focus', function() {

    // Do the repositioning actions

});

<强>更新

如果您：

，也会触发焦点事件

点击标题栏
最小化并最大化浏览器窗口
在任务栏中切换程序并切换回浏览器

jquery或js检测到何时在地址栏上输入相同的哈希码url

1 个答案: