DEVHIDE
Login Or Sign up

Is it possible to execute JavaScript after a browser back?

212 Views Asked by At

I'm working on a site that provides web access to to legacy data.
The basic flow is for the user to select a query form from a menu, fill out the form, and submit it. The server generates the appropriate HTML and returns it to the browser. So far, so good.

Some reports can take some time to generate. For those reports I display a "processing" indicator when the form is submitted. This indicator is a normally hidden <div> containing an animated icon.

The problem comes when a user uses the browser's Back button to return to the query form. When the browser re-displays the page with the query form, the processing indicator is still visible. The only way to get rid of it seems to be to refresh the page at that point.

Is there any way to hide it after the Back?

javascript html back
Original Q&A
3

There are 3 best solutions below

1
On

You could set a JavaScript event to automatically remove the indicator after the page loads. That way, the indicator won't display unless the script later tells the indicator to show. In order to avoid never displaying the indicator, you could place the code that displays the indicator after the event that automatically hides it, both occurring on the page loading.

0
On

As far as I could find, you should be able to use pageshow window event:

The pageshow event is sent to a Window when the browser displays the window's document due to navigation.

This includes:

  • Initially loading the page
  • Navigating to the page from another page in the same window or tab
  • Restoring a frozen page on mobile OSes
  • Returning to the page using the browser's forward or back buttons
<!DOCTYPE html>

<script>
  window.addEventListener("load", console.log);
  window.addEventListener("pageshow", console.log);
</script>

<p><a href="https://html.spec.whatwg.org/multipage/">Navigate
  away</a> (then come "Back")</p>

See also:

0
On

I finally have a solution for this that is working well enough in this application.

Some browsers, like Firefox, fire a document.focus event when the page is re-displayed. Others, like Safari, fire a window.popstate event instead.

I now hook both of these events and it works as expected 99.9% of the time.

Related Questions in JAVASCRIPT

Related Questions in HTML

Related Questions in BACK

Trending Questions

Popular # Hahtags

javascript python java c# php android html jquery c++ css ios sql mysql r reactjs node.js arrays c asp.net json python-3.x ruby-on-rails .net sql-server swift django angular objective-c pandas excel

Popular Questions

Copyright © 2021 Jogjafile Inc.