Trying to disable the browser's back button

Question

I've written two HTML files:

Login.html <a href = "Home.html">Next Page</a>
Home.html`

<html> <body> <a href = >Login.html>>Prev Page</a> </body> <script type = "text/javascript" >	history.pushState("anything", "", "#1");	window.onhashchange = function (event) {	window.location.hash = "a";	}; </script> </html>

` I'm trying to disable browser's back button. If i execute this code on chrome it doesn't disable the back button but if i run history.state command in console of Home.html page and then i click the back button, then it remains on same page(works as expected). Why so?

See how to stop browser back button using javascript and How to disable back button in browser using javascript. — showdev
– showdev, Commented Jan 30, 2020 at 10:16

Saksham Chaudhary · Accepted Answer · 2020-12-24 05:00:38Z

9

FOA, Thanks everyone for your answers.

Finally below code gave me the solution:

history.pushState(null, null, window.location.href); history.back(); window.onpopstate = () => history.forward();

edited Dec 24, 2020 at 5:00

answered Mar 28, 2020 at 8:50

Saksham Chaudhary

7071 gold badge7 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

D_S_X Over a year ago

Can someone explain why the first 2 lines are required? Just adding window.onpopstate = () => history.forward(); is working fine for me

Jashvita Over a year ago

where do I add this line of code? I am using ASP.Net MVC 4.8

Naresh Etikyala Over a year ago

@Saksham Chaudhary infosec security issues will come with : window.location.href

Ken Kinder · Accepted Answer · 2020-01-30 10:12:49Z

2

You can't disable the browser's back button. If you could, that would be a security hazard and the browser vendors would most likely seek to fix it.

answered Jan 30, 2020 at 10:12

Ken Kinder

13.2k6 gold badges54 silver badges72 bronze badges

2 Comments

David Walser Over a year ago

according to the acceped answer this is deprecated, right?

Ken Kinder Over a year ago

no. the first answer is manipulating history, not disabling the back button

Thriveni · Accepted Answer · 2020-01-30 10:13:43Z

The HTML5 History API gives developers the ability to modify a website's URL without a full page refresh. This is particularly useful for loading portions of a page with JavaScript, such that the content is significantly different and warrants a new URL.

You can check this link it may helpful

https://css-tricks.com/using-the-html5-history-api/

Collectives™ on Stack Overflow

Trying to disable the browser's back button

3 Answers 3

3 Comments

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

2 Comments

Comments

Linked

Related