Thats makes me crazy.
I am calling details page from primary page, using, javascript - window.open("4prod.html?pkd="+idd,'_self', false); that open in the same window page with product details. When this details page has been opened there is a button "back", again in javascript -onclick="history.go(-1); return false;.
In FF works great, it means, that on "back" button from details page, the primary page appears with state as I left it, but in Chrome and IE "back" button reload primary page and all entries (inputs, color changes etc. which users have made) have gone and new - refreshed page is displayed.
How I can avoid reloading in Chrome nad IE just call of cached primary page ?
This answer says it's impossible without cookies if the URL changes. Is it possible to just have the form in one <div>, then hide it (and show the details in another <div>), then when the back button is clicked, just reverse this? If anything, (once the page has loaded the JS) the execution would be faster.
Related
I have a very rudimentary SPA built in vanilla JS. There are two buttons that the user can use to navigate between pages, for example:
buttonProfile.addEventListener("click", function () {
window.history.pushState({}, "", "profile/");
var updatePage = new Event("update-page");
dispatchEvent(updatePage);
});
Somewhere in the app, I have an event listener that listens to update-page to refresh the content that needs to be refreshed (without ever reloading the page) based on the current URL. Everything works fine.
However, I noted two odd behaviours:
If the user starts on Page A and then moves to Page B, the user will need to go back twice (button on the browser) in order to go back to Page A.
If the user goes back from Page B to Page A, once they are back to Page A the "forward" button on the browser will become greyed out.
EDIT
In case it helps, I noted I have the same issue when I use other people's SPAs that have a similar implementation. See this simple demo for example: DEMO | CODE
Steps to reproduce:
Click on About, then Contact, then again About, then again Contact.
Now, if you press Back once you'll go back to About. However, if you press it again you'll stay on About. You'll have to press it again to move to Contact and once you do, the Forward button will be disabled.
EDIT 2
I just realize that both my site and the site I posted above work fine when I run my browser in Incognito. There must be some other problem with my Chrome (though I have no idea what).
Okay, I found it. It was the Matter official Chrome extension. Not sure what exactly caused the issue though.
I have a problem when I am trying to check the source of an interesting page which keeps refreshing automatically every 3-5 seconds (presumably due to some js script) which resets my Inspect Element Inspector window every time the page is refreshed.
Is there any other way other to stop that page from refreshing or perhaps the Inspector window from resetting itself other than turning on NoScript to stop the page from refreshing automatically?
Usually I just open DevTools, switch to the appropriate panel if necessary, and hit pause.
Opening DevTools: Via menus, or by press F12, Ctrl+Shift+I, or Cmd+Shift+I depending on browser and OS.
Switching panels: Pick the panel from the tabs at the top of DevTools. It'll be called "Debugger" (Firefox, IE) or "Sources" (Chrome) or similar.
Pausing: In the Debugger/Sources panel, click the pause button (usually looks like the pause button on a television remote control, ||) or press the keyboard equivalent. Keyboard equivalents are
Firefox & Chrome: F8
IE: Ctrl+Shift+B
(Updated 2020-03-30)
In Firefox 74 this option is in Options -> Privacy & Security -> Permissions
(Original reply)
Firefox has the option to prevent refresh natively, the option is in Advanced->General->Warn me when websites try to redirect or reload the page
The most popular solution for this problem is to trap the beforeunload event. The browser will ask the user for confirmation to leave the page. The code, in its simplest form, looks like this:
window.onbeforeunload = function() { return true }
You can enter this code in console. Alternately, you can simply paste the following URL in the browser address bar (console not required). You can even bookmark it.
javascript:window.onbeforeunload = function() { return true }
Be advised that modern browsers might chop off the javascript: part when you paste it inside the address bar; make sure you type it back.
To determine the cause of redirect in Firefox, try the following:
Open Web Developer Tools (CTRL + SHIFT + I), open "Toolbox Options" and check the "Enable persistent logs" option. This makes the logs persist across page loads (logs are cleared otherwise).
Now switch to "Network Monitor" tab.
Open the URL and let it refresh.
Inside the Network Monitor > Cause column you will find out why the page reloads.
The cause column is pretty ambiguous (Chrome does a much better job). However, if JavaScript was used to trigger page (re)load then it at least shows you the filename and line number of that script.
When the page is still loading, you can press the Esc key. While the page is still white, press it. When you stop the page from loading at this point, this usually stops all the auto loaded javascript. Any scripts that run on actions are usually not effected. Each page is different, try different timings.
When I use a site called NovelUpdates there is javascript that can make certain elements hidden, and when I press Esc on page load all the elements that would be hidden after page load are visible. Then when I click a button that would execute javascript that operates with no problems. NoScript isn't going to solve your issue I believe.
Another example of this are those websites with annoying boxes that pop out after 10 seconds that says you aren't a member and can't view any more of this site without logging in, like some news article websites.
What you could do is use the command exit(), which is the equivalent to die in php and simply stops the script.
If you don't know what's causing it and you don't want to look for the "bad boy", then you might as well stop the entire script at the very bottom of the page.
Our site has an issue where the browser back button is not returning you to the page you navigated from. Specifically, this occurs when you click a link to navigate to our home page and the browser back button is then not working. We need a temporary fix to this problem until we can correctly resolve this issue.
So, is it possible to have some jquery or javascript that does the following:
If a user is on a specific page (for example, www.abc.com/index.htm), and the user clicks the browser back button, force the browser to display the page www.xyz.com?
I am not a software developer so my knowledge of coding is fairly rudimentary and I do know that changing the default behavior of the browser back button is not good practice.
Is there any way to stop a web page from refreshing when it is displayed after someone presses the back button?
My web page shows different information every time it is refreshed. I want it to show whatever it was showing before the user moved to another page.
Is this possible? If so how?
No.
The contents of the window when the 'back' button is pressed is actually data your browser has cached so preventing 'back' is not going to help.
You could maybe use a hash though.
go to
stackoverflow.com
then go to
stackoverflow.com#foo
then go to
stackoverflow.com#foobar
If you hit the back button you'll notice the hash changes but the page does not refresh.
Sorry about the formatting. Blame SO!
I'd like to execute a javascript (or jQuery) initialization function -- let's call it myPageInit() after a page is fully loaded.
Here's the catch: myPageInit() should run only when the page is initially loaded or if the user forces a page refresh (i.e. presses the browser's reload button, hits F5, etc.).
It should not run if the user follows a link from the page and then hits the back button.
For the avoidance of doubt:
User navigates to www.mypage.com => myPageInit() runs after page is loaded.
User now hits browser refresh button => myPageInit() runs after page is reloaded.
User now clicks on a link on the page (e.g. <a href="www.cnn.com">... ).
User clicks back button to get back to www.mypage.com => myPageInit() does not run after page is shown.
What I've tried so far
$(window).load() -- I think this used to work, but on modern browsers this appears to fire when the user presses the back button (see the comments on this issue)
$(window).ready() -- This also appears to fire on both initial load and back button.
Searching SO for other relevant answers. I still haven't found what I'm looking for.
Thanks in advance!
Maybe not exactly what you needed, but how about a session cookie or HTML storage flag? See code and answers at:
e.g. create session based cookie, jquery