How to stop browser back button using JavaScript ?

03 Jan, 2022
In this article, we will discuss how to write a javascript function which will prevent the user to navigate back to the last or previous page. There are so many ways to stop the browser back button most popular and will work in all conditions. You can add code to the first or previous page to force the browser to go forwards again and again so when the user tries to back to the previous page the browser will take him again in the same.
This can be done by making custom functions like this:Example 1:
Code 1: Save this file as Login.html for the first page.htmlhtml<!DOCTYPE html><html>      <head>    <title>        Blocking Back Button        using javascript    </title>          <style type="text/css">        body {            font-family:Arial;            color:green;        }    </style>          <script type="text/javascript">        window.history.forward();        function noBack() {            window.history.forward();        }    </script></head>  <body>    <h1>GeeksforGeeks</h2>          <p>        Click here to Goto         <a href="b.html">            Link to second page        </a>    </p></body>  </html>
html
<!DOCTYPE html><html>      <head>    <title>        Blocking Back Button        using javascript    </title>          <style type="text/css">        body {            font-family:Arial;            color:green;        }    </style>          <script type="text/javascript">        window.history.forward();        function noBack() {            window.history.forward();        }    </script></head>  <body>    <h1>GeeksforGeeks</h2>          <p>        Click here to Goto         <a href="b.html">            Link to second page        </a>    </p></body>  </html>
Code 2: Save this file as b.html for the second page.htmlhtml<!DOCTYPE html><html>      <head>    <title>        Blocking Back Button        using javascript    </title></head>  <body>     <h3>This is second page</h3>            <p>         On this page, back button         functionality is disabled.     </p></body>  </html>
html
<!DOCTYPE html><html>      <head>    <title>        Blocking Back Button        using javascript    </title></head>  <body>     <h3>This is second page</h3>            <p>         On this page, back button         functionality is disabled.     </p></body>  </html>
Output:
Example 2:
Code 1: Save this file as a.html for the first page.htmlhtml<!DOCTYPE html><html>      <head>    <title>First Page</title>          <script type="text/javascript">        function preventBack() {            window.history.forward();         }                  setTimeout("preventBack()", 0);                  window.onunload = function () { null };    </script></head>  <body>    <h3>This is first page</h3>    <hr />    <a href = "b.html">Goto second Page</a></body>  </html>
html
<!DOCTYPE html><html>      <head>    <title>First Page</title>          <script type="text/javascript">        function preventBack() {            window.history.forward();         }                  setTimeout("preventBack()", 0);                  window.onunload = function () { null };    </script></head>  <body>    <h3>This is first page</h3>    <hr />    <a href = "b.html">Goto second Page</a></body>  </html>
Code 2: Save this file as b.html for the second page.htmlhtml<!DOCTYPE html><html>      <head>    <title>Second Page</title></head>  <body>    <h3>        Second Page - Back Button        is disabled here.    </h3>    <hr /></body>  </html>
html
<!DOCTYPE html><html>      <head>    <title>Second Page</title></head>  <body>    <h3>        Second Page - Back Button        is disabled here.    </h3>    <hr /></body>  </html>
Output:
sooda367
JavaScript-Misc
Picked
Web technologies
JavaScript
Web Technologies
Web technologies Questions
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Difference between var, let and const keywords in JavaScript
Differences between Functional Components and Class Components in React
Remove elements from a JavaScript Array
Roadmap to Learn JavaScript For Beginners
Difference Between PUT and PATCH Request
Installation of Node.js on Linux
Top 10 Projects For Beginners To Practice HTML and CSS Skills
Difference between var, let and const keywords in JavaScript
How to insert spaces/tabs in text using HTML/CSS?
How to fetch data from an API in ReactJS ?