Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Browser back button handling

I am trying to handle browser back button event but i could not find any solution.

I want to ask user if he clicks on browser back button using "confirm box" if he chooses ok i have to allow back button action else i have to stop back button action.

Can any one help me in implementing this.

like image 731
Ramesh Paul Avatar asked Jan 27 '13 00:01

Ramesh Paul


People also ask

How does a browser back button work?

A back button in the browser lets you back-up to the copies of pages you visited previously. The web browser's back and next buttons work well with web sites that provide information that changes infrequently, such as news and shopping web sites.

How do you handle back button of browser in react?

Intercept or Handle the Browser's Back Button in React Router. We can listen to back button actions by running the setRouteLeaveHook event for back button actions. } export default withRouter(App);


2 Answers

Warn/confirm User if Back button is Pressed is as below.

window.onbeforeunload = function() { return "Your work will be lost."; }; 

You can get more information using below mentioned links.

Disable Back Button in Browser using JavaScript

I hope this will help to you.

like image 144
Sampath Avatar answered Sep 23 '22 18:09

Sampath


You can also add hash when page is loading:

location.hash = "noBack"; 

Then just handle location hash change to add another hash:

$(window).on('hashchange', function() {     location.hash = "noBack"; }); 

That makes hash always present and back button tries to remove hash at first. Hash is then added again by "hashchange" handler - so page would never actually can be changed to previous one.

like image 35
Szorstki Avatar answered Sep 19 '22 18:09

Szorstki