javascript - JQuery "undo"返回单击时调用另一个函数的操作

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/Manipulating_the_browser_history

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

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

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