h5的pushState()改变url后如何让popState事件触发？

Question

1.我用js去操作浏览器的url，比如history.pushState(null,null,'/home')
但是程序还是无法知道我改变了url,onpopstate事件无法监听到pushState()方法，
请问如何利用h5最新的history api去监听js改变了url呢？

Answer 1

你pushState的后面跟上你要在url改变后的方法不就行了，为什么要在onpopstate里监听,pushState的行为毕竟是你已知的

Answer 2

onpopstate无法监听到pushState的方法，可劫持pushState方法,增加一个onPushState的钩子

(function(history){
    var pushState = history.pushState;
    history.pushState = function(state) {
        if (typeof history.onPushState === "function") {
            history.onPushState({state: state});
        }
        return pushState.apply(history, arguments);
    };
})(window.history);

history.onPushState = function(state) {
    // to do
    console.log(state)
}
history.pushState({info: 'test'} ,'test', '/test')