window.history.pushState not going back in history

问题:

I have a little problem experimenting with the history.pushstate event. I set it up so that the url of the page would be the actual URL of the page loaded via AJAX and that works just fine.

I understood that it should automaticaly create a history, loading the pages previously loaded. unfortunatly hat doesn't happen and when i click back of forward the url does change but not the page. Can you help me? Here is my simplified code:

    function hijackLinks() {
        $('a').live("click", function (e) {
            e.preventDefault();
            loadPage(e.target.href);    
            direction = $(this).attr('class');        
        });   
    }


    function loadPage(url) {
        if (url === undefined) {
            $('body').load('url', 'header:first,#content,footer', hijackLinks);
        } else {
            $.get(url, function (data) {
                $('body').append(data);
                 window.history.pushState(url, url, url);

                if (direction === "leftnav") {
                   //DO STUFF
                }
                if (direction !== "leftnav") {
                   //DO STUFF
                }

                setTimeout(function () {
                  //DO STUFF
                },1000);
            });
        }
    }
    $(document).ready(function () {
        loadPage(); 

    });

回答1:

Figured it out :D, well kind of. At least it works :)

I just added

    window.addEventListener("popstate", function(e) {
    loadPage(location.pathname);
});

to the end of the page :)

回答2:

I have same problem, but I fixed it. It's very easy

code example:

window.addEventListener("popstate", function(e) {
    window.location.href = location.href;
});

回答3:

Yeah Safari iOS has a fair few bugs with the HTML5 History API - actually, all the HTML5 browsers work differently than each other, so the functionality isn't really that standard right now.

There is History.js which solves the cross-browser compatibility problems and also provides an optional HTML4 hash fallback if you'd like. You can also refer to the "Notes on Compatibility" section for information on all the browser bugs that it fixes.