如何检测history.pushState和history.replaceState的使用?

52

有没有一种事件可以订阅,当历史状态被修改时触发?如何实现?

1个回答

47

以前我也用这个来得知何时调用了pushStatereplaceState:

// Add this:
var _wr = function(type) {
    var orig = history[type];
    return function() {
        var rv = orig.apply(this, arguments);
        var e = new Event(type);
        e.arguments = arguments;
        window.dispatchEvent(e);
        return rv;
    };
};
history.pushState = _wr('pushState'), history.replaceState = _wr('replaceState');

// Use it like this:
window.addEventListener('replaceState', function(e) {
    console.warn('THEY DID IT AGAIN!');
});

虽然这通常过于冗余,并且在所有浏览器中可能都不起作用。(我只关心我自己的浏览器版本。)

NB. 它也不能在Google Chrome扩展程序内容脚本中工作,因为它不允许更改网站的JS环境。您可以通过插入带有该代码的<script>来解决此问题,但这甚至更加过度了。


1
在我的情况下,浏览器抱怨在这个覆盖中缺少arguments...只需将第一个返回的函数更改为return function(...arguments) { - David Renner

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接