JQuery 通过在返回单击时调用另一个函数来“撤消”操作

Question

有没有办法在单击后退按钮时“撤消”jQuery 执行的函数？例如，我要执行的函数名为 doSomething：

function doSomething(button) {
     ...clicking the button does something...
}

我有一个撤消功能，可以撤消上述功能，undoDoSomething：

function undoDoSomething(button) {
    ....undoes the doSomething function...
}

如何调用按钮的函数，然后如果在执行该函数后立即单击后退按钮，我可以调用 undoDoSomething 函数来撤消该函数？

我知道 jQuery History 可以返回到保存在历史记录中的上一页，但是如何使用它来调用函数？

Answer 1

历史 API 让这变得简单： http: //jsfiddle.net/Z9dRY/

html:

<button>Increase</button>click back button to decrease
<span id="counter">0</span>

js:

$("button").click(function(){
    var count = +$("#counter").text() + 1;
    history.pushState({count:count});
    $(counter).text(count);
})
$(window).on("popstate",function(e){
    if (e.originalEvent.state)
        $(counter).text(e.originalEvent.state.count);    
})

在每个操作中，添加到历史记录，然后每次后退按钮单击都会撤消每个更改（当然，您必须开发撤消部分。在这种情况下，我只是存储了此时应更改的计数并更改它。）

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulated_the_browser_history

请注意浏览器支持，此代码适用于所有现代浏览器和 IE10+。oldIE 需要使用 iframe 或 url 中的哈希来解决问题。

这是添加了减少按钮的同一示例，以表明它并没有真正改变任何内容：http://jsfiddle.net/Z9dRY/1/它甚至固有地支持前进按钮（重做）。

更新：修复丢失初始状态：http://jsfiddle.net/Z9dRY/2/