js中为何直接监听pushState事件无效？

Question

chrome 63，直接监听pushState事件无效：window.addEventListener("pushState", function () {        // code    });直接监听replaceState也是无效的，popstate有效。我搜索之后在jb51上找到了一个办法，先添加一段代码，再添加监听就可以了。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');那么为什么直接监听无效呢？是浏览器的问题还是什么原因？测试网址：pixiv 特辑（需要科学上网），从这个页面进入子页面用的就是pushState。

Answer 1

没有onpushstate这个事件，当然无法监听到了。

可以把history劫持一下：

(function(history){

    var pushState = history.pushState;

    history.pushState = function(state) {

        if (typeof history.onpushstate == "function") {

            history.onpushstate({state: state});

        }

        // ... whatever else you want to do

        // maybe call onhashchange e.handler

        return pushState.apply(history, arguments);

    };

})(window.history);

history.onpushstate = function(e) {

    console.log('pushed');

}

效果：