发表新帖
发表新帖

Browser “Back” Button vs. jQuery-animated page

后端 未结
关注
3 927
攒了一身酷
攒了一身酷 2020-12-15 23:42

I have a challenging problem I\'ve been battling for some time now.

The Problem: when I go back to previous page using browser\'s back button, the page is d

相关标签:
3条回答
  • 傲寒
    2020-12-16 00:07

    Disclaimer: The following isn't exactly a robust solution, but I found it amusing and thought I ought to share.

    I had a similar requirement in the past, and strangely enough, the solution I ended up with was to downgrade to jQuery to take advantage of a bug in jQuery 1.3.

    I only tested this on one version of Firefox, so YMMV, but try the following:

    • Using jQuery 1.3 - this repeats the animation when you click the link then come back with the back button
    • Using jQuery 1.4 - this doesn't

    This was sufficient for my use-case since I was targeting a limited audience and only made minimal use of jQuery. That said, I'm eagerly watching this thread in a hope of finding a better solution.

    Update

    Following the trail of the above stated jquery bug, it looks like you can get the same effect by disabling the bfcache.

    The simplest way to do would be to add an onunload attribute to body. (more details in link).

    <body onunload=''>

    Here's an example, which uses jquery 1.6. Again, not thoroughly tested so YMMV.

    • Using jQuery 1.6, with bfcache disabled
    0 讨论(0)
  • 一向
    2020-12-16 00:07

    Check out this thread. He suggests a hack as given below (copied from there):

    The onload event should be fired when the user hits the back button. Elements not created via JavaScript will retain their values. I suggest keeping a backup of the data used in dynamically created element within an INPUT TYPE="hidden" or TEXTAREA set to display:none then onload using the value of the textbox to rebuild the dynamic elements to the way they were.

    If you don't care about rebuilding the page and want to actually reload it, then you could do: Code:

    <input type="hidden" id="refreshed" value="no">
<script type="text/javascript">
onload=function(){
var e=document.getElementById("refreshed");
if(e.value=="no")e.value="yes";
else{e.value="no";location.reload();}
}
</script>

    you can make the hidden value as "Yes" on #menu click.

    HTH

    0 讨论(0)
  • 抹茶落季
    2020-12-16 00:29

    The above answers touch on the problem, but provide hacky ways to solve the question. This seems to be the proper way to do it.

    $(window).bind('pageshow',function(){
    alert("This page will run even if the back button was pressed!");
});

    To read more on the pageshow/pagehide events see here: http://www.webkit.org/blog/516/webkit-page-cache-ii-the-unload-event/

    You could can take it a step further like this:

    $(window).bind('pageshow',function(e){
        if (e.persisted) {
            alert("pageshow event handler called.  The page was just restored from the Page Cache.");
        } else {
            alert("pageshow event handler called for the initial load.  This is the same as the load event.");
        }
}
    0 讨论(0)
 看不清?
提交回复
热议问题