Javascript 让我的后退和前进按钮使用ajax

我的网站运行得更快，这多亏了我精心修改的一些代码，但我希望浏览器的后退/前进按钮能够正常工作。现在，使用下面的代码，浏览器地址栏永远不会改变。当有人单击“后退”时，它会将他们带出应用程序

是否有任何简单的方法来改变这一点，使浏览器的后退/前进按钮工作？或者如果有人能给我指出正确的方向。谢谢你的帮助

$(document).on("ready", function () {

    //I want to load content into the '.page-content' class, with ajax

    var ajax_loaded = (function (response) {

        $(".page-content")

        .html($(response).filter(".page-content"));

        $(".page-content .ajax").on("click", ajax_load);


    });



    //the function below is called by links that are described 
    //with the class 'ajax', or are in the div 'menu' 

    var history = [];

    var ajax_load = (function (e) {

        e.preventDefault();


        history.push(this);
        var url = $(this).attr("href");
        var method = $(this).attr("data-method");


        $.ajax({
            url: url,
            type: method,
            success: ajax_loaded
        });

    });


    //monitor for clicks from menu div, or with
    //the ajax class
    //why the trigger?

    $("#menu a").on("click", ajax_load);
    $(".ajax").on("click", ajax_load);
    $("#menu a.main").trigger("click");



});

---

下面是一种检测您所问问题的方法

在我玩后退和前进按钮的过程中，熊是一项危险的任务

window.onload = function () {

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

        history.pushState("someState", null, null);

        window.onpopstate = function () {

            history.pushState("newState", null, null);

            // Handle the back (or forward) buttons here
            // Will not handle refresh, use onbeforeunload for this.
        };
    }
}

---

你一定要检查一下 下面是一些示例代码：-

  (function(window,undefined){

    // Prepare
    var History = window.History; // Note: We are using a capital H instead of a lower h
    if ( !History.enabled ) {
         // History.js is disabled for this browser.
         // This is because we can optionally choose to support HTML4 browsers or not.
        return false;
    }

    // Bind to StateChange Event
    History.Adapter.bind(window,'statechange',function(){ // Note: We are using statechange instead of popstate
      var State = History.getState(); // Note: We are using History.getState() instead of event.state
      //History.log(State.data, State.title, State.url);
      var goto_url = State.url;            
      $.ajax({
          url: goto_url,
          dataType: "script"
      });
    });
  })(window);

---

您可以使用jquery地址插件（）。 它有一个事件，用于检测用户何时按下后退/前进按钮

$.address.externalChange(function() { console.log('back/forward pressed'); });

---

据我所知，没有办法区分前进和后退。

是的。History.js-它推送浏览器状态并允许前后移动有趣，但不确定如何实现。我要找的代码肯定是注释的“//这里处理后退（或前进）按钮”？你所说的“我玩后退和前进按钮是一项危险的任务”，是什么意思？谢谢。干杯，我来看看。我认为history.js对于我所需要的可能太大了——我所有的ajax都在工作，只有那些讨厌的后退/前进按钮。