Solution 1 :

FOA, Thanks everyone for your answers.

Finally below code gave me the solution:

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

Solution 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.

Solution 3 :

It is generally a bad idea overriding the default behavior of web browser. Client side script does not have the sufficient privilege to do this for security reason.

There are few similar questions asked as well,

How can I prevent the backspace key from navigating back?

How to prevent browser’s default history back action for backspace button with JavaScript?

You can-not actually disable browser back button. However you can do magic using your logic to prevent user from navigating back which will create an impression like it is disabled. Here is how, check out the following snippet.

(function (global) { 

    if(typeof (global) === "undefined") {
        throw new Error("window is undefined");

    var _hash = "!";
    var noBackPlease = function () {
        global.location.href += "#";

        // making sure we have the fruit available for juice (^__^)
        global.setTimeout(function () {
            global.location.href += "!";
        }, 50);

    global.onhashchange = function () {
        if (global.location.hash !== _hash) {
            global.location.hash = _hash;

    global.onload = function () {            

        // disables backspace on page except on input fields and textarea..
        document.body.onkeydown = function (e) {
            var elm =;
            if (e.which === 8 && (elm !== 'input' && elm  !== 'textarea')) {
            // stopping event bubbling up the DOM tree..


This is in pure JavaScript so it would work in most of the browsers. It would also disable backspace key but key will work normally inside input fields and textarea.

Recommended Setup:
Place this snippet in a separate script and include it on a page where you want this behavior. In current setup it will execute onload event of DOM which is the ideal entry point for this code.

Working Demo link->

Solution 4 :

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

Problem :

I’ve written two HTML files:

  1. Login.html
    <a href = "Home.html">Next Page</a>
  2. Home.html`
      <a href = >Login.html>>Prev Page</a>
<script type = "text/javascript" >

	history.pushState("anything", "", "#1");
    	window.onhashchange = function (event) {
       		window.location.hash = "a";

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?


Comment posted by how to stop browser back button using javascript


Comment posted by D_S_X

Can someone explain why the first 2 lines are required? Just adding

Comment posted by Jashvita

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

Comment posted by David Walser

according to the acceped answer this is deprecated, right?

Comment posted by Ken Kinder

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