-1

How to disable the browser back button using javascript in a HTML page. Can we get any callback method trigerred on click of backbutton on browser using Javascript and not using Jquery Mobile library.

Solution would be really appreciated. I tried with few solutions online, but nothing seemed to work.

Manju
  • 2,520
  • 2
  • 14
  • 23
  • 3
    Why would you want to do that? If a website prevented me from using the back button I would never go to that site. – Mike Cluck Aug 19 '16 at 17:14
  • @MikeC When the user land up in a confirmation page in my website, i dont the user to use the browser back button to go back to the previous page. I either want the back button in the browser to be non clickable or when he clicks on back button, the current page should only reload – Manju Aug 19 '16 at 17:18
  • But why? It sounds like you're trying to solve some problem with the wrong solution. – Mike Cluck Aug 19 '16 at 17:20
  • You can't disable the back button in any browser. You can show a confirmation dialogue by binding to the onbeforeunload or onunload event, asking the user if they're sure. However, not all browsers support this, and it's important to note that this event is triggered on any navigation away from the current page, including links. See http://stackoverflow.com/questions/7080269/javascript-before-leaving-the-page/7080331#7080331 – Bill Doughty Aug 19 '16 at 17:20
  • @BillDoughty Is there a way where i can capture the back button click of browser and do a window.history.forward() so that i can stay on the same page – Manju Aug 19 '16 at 18:02
  • @Manju, no, you cannot. The function bound to `onbeforeunload` can only assign a returnValue string to the event and return a string which *may* be shown in the confirmation dialog. See https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload. – Bill Doughty Aug 19 '16 at 18:12

1 Answers1

1

You should never do that. https://www.irt.org/script/311.htm By the way, you may just warn the user using window.onbeforeunload.

You can-not actually disable browser back button. And there is no event for capturing the back button click. If it is really necessary you can do something like that:

(function (global) { 
    var _extra_hash = "!";
    var noBack = function () {
       global.location.href += "#";

       global.setTimeout(function () {
           global.location.href += _extra_hash;
       }, 50);
    };

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

    global.onload = function () {            
       noBack();

       // this is for disabling backspace on page except on input fields and textarea..
       /*document.body.onkeydown = function (e) {
           var elm = e.target.nodeName.toLowerCase();
           if (e.which === 8 && (elm !== 'input' && elm  !== 'textarea')) {
              e.preventDefault();
           }
           // stopping event bubbling up the DOM tree..
           e.stopPropagation();
        };*/          
    }

})(window);

But the user can still kill the tab. Anyway, It is generally a bad idea overriding the default behavior of web browser.

H. Jabi
  • 171
  • 3
  • 12