如何更改状态而不触发history.js中的状态转换?

时间:2021-10-26 20:59:51

I am using history.js and I have an event handler

我正在使用history.js,我有一个事件处理程序

$(window).bind('statechange', function(){
    // Loads the content representing the state via ajax
});

Most content changes are triggered by History.pushState([...]) when the user clicks a link or a button.

当用户单击链接或按钮时,大多数内容更改都由History.pushState([...])触发。

But in some cases the content change is managed by javascript directly (i.e. by changing, adding or removing a DOM element) and there is no need to load the content representing the new state via ajax.

但在某些情况下,内容更改由javascript直接管理(即通过更改,添加或删除DOM元素),并且不需要通过ajax加载表示新状态的内容。

Still, I need to push a state and change the url to reflect the new state, should the user hit reload or later want to use the back button etc.

仍然,我需要推送状态并更改URL以反映新状态,如果用户点击重新加载或稍后想要使用后退按钮等。

So my question is: How do I push a state but avoid loading the content in some cases? Is there a kind of flag that can be passed to the statechange event handler or can I circumvent it altogether?

所以我的问题是:如何推送状态,但在某些情况下避免加载内容?是否有一种可以传递给statechange事件处理程序的标志,还是我可以完全绕过它?

1 个解决方案

#1


7  

I wondered about this question too. My decision was to use a global variable. For instance, you can initialize window.stateChangeIsLocal as false:

我也想知道这个问题。我的决定是使用全局变量。例如,您可以将window.stateChangeIsLocal初始化为false:

window.stateChangeIsLocal = false;

Your statechange handler could be looking something like this:

你的statechange处理程序可能看起来像这样:

History.Adapter.bind(window,'statechange',function(){
    if (!window.stateChangeIsLocal) {
        someAjaxLoadFunction(History.getState().url);
    }
    else {
        window.stateChangeIsLocal = false;
    }
});

When you change the state and do not want to load a content of a new state, just set window.stateChangeIsLocal as true;

当您更改状态并且不想加载新状态的内容时,只需将window.stateChangeIsLocal设置为true;

Maybe there are some more elegant solutions, but I couldn't find them and use this.

也许有一些更优雅的解决方案,但我找不到它们并使用它。

#1


7  

I wondered about this question too. My decision was to use a global variable. For instance, you can initialize window.stateChangeIsLocal as false:

我也想知道这个问题。我的决定是使用全局变量。例如,您可以将window.stateChangeIsLocal初始化为false:

window.stateChangeIsLocal = false;

Your statechange handler could be looking something like this:

你的statechange处理程序可能看起来像这样:

History.Adapter.bind(window,'statechange',function(){
    if (!window.stateChangeIsLocal) {
        someAjaxLoadFunction(History.getState().url);
    }
    else {
        window.stateChangeIsLocal = false;
    }
});

When you change the state and do not want to load a content of a new state, just set window.stateChangeIsLocal as true;

当您更改状态并且不想加载新状态的内容时,只需将window.stateChangeIsLocal设置为true;

Maybe there are some more elegant solutions, but I couldn't find them and use this.

也许有一些更优雅的解决方案,但我找不到它们并使用它。