“hashchange”不会在 Wordpress 中触发

Question

您好，我正在建设这个网站：http://www.freiheitmedia.com/en/。它是用 Themify Ultra 主题构建的。

我的目标是在滚动或单击 link 时摆脱 url 中的 #something 部分。

我需要用 JavaScript/jQuery 来做，因为没有基于主题的解决方案，支持人员也帮不了我。

我已经测试并且知道下面的代码替换了我想要的 url:

history.replaceState("",document.title,window.location.pathname + window.location.search);

现在，问题是 我似乎无法触发 "hashchange" 事件。 我将以下代码放在页脚和警报语句中两种情况均未达到：

<script>
    window.addEventListener("hashchange", function(e){
        alert("hiii");
    });
</script>

或

<script>
    window.addEventListener("hashchange", function(e){
        alert("hiii");
    }, false);
</script>

我怀疑 hashchange 事件可能被主题的设置阻止了，但这只是一个猜测。

你们知道为什么 "hashchange" 没有开火吗？

Answer 1

来自您的澄清评论：

when you visit the site, and scroll down, you will see that the url changes depending what section you are in. Specifically the #part changes. My goal was to prevent this behavior and have a clean url (without any #hashes) all the time.

最好的方法是找到通过更新散列来响应滚动事件的插件（这大概是有帮助的；如果您将其添加为书签，则会带您回到页面的那部分）并将其关闭。与页面上的插件争夺哈希的控制权是个坏主意。

仅次于此：

由于 hashchange 未触发，插件必须使用 history 的 replaceState 或 pushState 或类似设置散列，因为它不会t 开火 hashchange。您可以将这些函数替换为您自己的去除散列片段的版本：

// I DON'T RECOMMEND THIS APPROACH
(function() {
    function removeHash(url) {
        var u = String(url || "");
        var x = u.lastIndexOf("#");
        return x == -1 ? u : u.substring(0, x);
    }
    var originalReplaceState = history.replaceState;
    history.replaceState = function(state, title, url) {
        url = removeHash(url);
        return originalReplaceState.call(history, state, title, url);
    };
    var originalPushState = history.pushState;
    history.pushState = function(state, title, url) {
        url = removeHash(url);
        return originalPushState.call(history, state, title, url);
    };
})();

不过，再说一遍，最好通过添加散列片段并禁用它来找到响应滚动事件的任何内容。

“hashchange”不会在 Wordpress 中触发

“hashchange” doesn't fire in Wordpress

javascript

wordpress

jquery

hashchange