Disable Back Button in Browser using JavaScript

[ad name=”AD_INBETWEEN_POST”] Sometimes we have requirement in developing a website to disable the Back button effect from Browser. This is common in Online Banking Websites and other sites where security is of principal concern. User may hit back and navigate from the page and forget to logout. Hence sometime it is required that we disable the functionality of Back button. But unfortunately this is not an easy task. There is no direct way of dealing with this problem. We can do few hacks to ensure that user does not get back in the browser. Following are few tricks that can be used to disable the back button in browser. Please note that we do not literally “disable” the back button, but just nullify its effect is some case and hide it altogether in others. disable-back-button-browser

Open A New Window without Back Button

browser-back-button-viralpatelThis one is very crude technique. But in some case it works like charm. All you have to do is to open the webpage in a new window. This window doesn’t have back button at all because we have hide the toolbar. This technique does work in some case but user has still a workaround to navigate to previous page. Most of the browser have options of Back in context menu. Thus user can still right click on the page and click Back to go to previous page. We will shortly see the workaround for this issue also. Following is the code to open webpage in a new window have no toolbar (Back/Next buttons).
window.open ("https://www.viralpatel.net/", "mywindow","status=1,toolbar=0");
Code language: JavaScript (javascript)
Also it is possible to disable the right click on any webpage using Javascript. Add following code in the webpage.
<body oncontextmenu="return false;">
Code language: HTML, XML (xml)

Disable Back functionality using history.forward

This is another technique to disable the back functionality in any webpage. We can disable the back navigation by adding following code in the webpage. Now the catch here is that you have to add this code in all the pages where you want to avoid user to get back from previous page. For example user follows the navigation page1 -> page2. And you want to stop user from page2 to go back to page1. In this case all following code in page1.
<SCRIPT type="text/javascript"> window.history.forward(); function noBack() { window.history.forward(); } </SCRIPT> </HEAD> <BODY onload="noBack();" onpageshow="if (event.persisted) noBack();" onunload="">
Code language: HTML, XML (xml)
The above code will trigger history.forward event for page1. Thus if user presses Back button on page2, he will be sent to page1. But the history.forward code on page1 pushes the user back to page2. Thus user will not be able to go back from page1.

Warn User if Back is Pressed

You may want to warn user if Back button is pressed. This works in most of the cases. If you have some unsaved form data, you might want to trigger a warning message to user if Back button is pressed. Following Javascript snippet will add a warning message in case Back button is pressed:
window.onbeforeunload = function() { return "You work will be lost."; };
Code language: JavaScript (javascript)
Include this in your HTML page to popup a warning message. Check the demo for this example. ONLINE DEMO
Get our Articles via Email. Enter your email address.

You may also like...

130 Comments

  1. This is really cool. I have posted it in DZone. Thanks for your time involved.

  2. Image Harika Rai says:

    How to delete cookie history on a sign out and not allowing back functionality by using javascript

  3. Image Nonye Ulasi says:

    Hi Viral,
    Thanks for the above code however, using the window. history.forward() function to disable the back browser works well on IE and Opear, but not on Safari and google chrome. Do you know why this is, and if so, could you supply some javascript code that will work on all browsers?
    Many Thanks
    Nonye

  4. Image sweta says:

    really good

  5. Image Manoj says:

    Hi Viral,
    Not working for Google chrome. Can you please give javascript code that will work on all browsers?
    Many Thanks

  6. see http://www.boutell.com/newfaq/creating/backbutton.html -use setTimeoutto delay call to forward. -should help for other browsers

  7. Image padma says:

    Only IE its working not in all browsers

  8. Image sathish says:

    but it is not working for Google chrome

  9. Image Mayur says:

    Read the below article :
    excellent one :
    The code works for IE 7, Chrome 4.1, Firefox 3.6.3
    http://www.boutell.com/newfaq/creating/backbutton.html

  10. thanks for this useful article. best regards.

  11. Image jeterboy says:

    hey thanks for this.

  12. Image Shobhraj says:

    Thanks….good content…

  13. Image vikash says:

    ////Open A New Window without Back Button//

    This method is not working in IE-7
    plz help me out

  14. Image amit says:

    this is not working

  15. Image Amit Herlekar says:

    Many thanks

  16. Image vishnu says:

    hi,
    Thanks….good answer
    But using PHP, how to prevent clicking the browser back button for authenticated pages

  17. Image Pavan says:

    Thanks this code works fine that disable to go back the previous page.

  18. Image Rubesh says:

    Not So Effective For me……………………………….!

  19. Image Azhar says:

    Hi..Thank you very much. It has helped me alot:)

  20. Image KAIALSH says:

    Hi Viral Sir i liked ur code of Itext to generate PDF also.This one is also cool!!Thanks a lot!

  21. Image divya says:

    Thanks a ton!!!
    Its kindly helpful for me..
    I knew “window.history.forward”
    but i was not frequent with javaScript so unable to use properly

    but ur article really helped me out!!!

    I want to ask you one more thing..
    if u wil reply then i wil ask something

    THANKSSS!!! :-)

  22. Image aadi says:

    Hey ,

    Thankz

    Its 2 good

  23. Image Dumindu says:

    Thanks

  24. Image salumiah says:

    excellent…
    am using this code in webpages…
    thankyou

  25. Image balaji says:

    thank you for the code

  26. Image Shishir says:

    Cool….. Thankyou so much…

  27. Image tito says:

    thanks so much

  28. This is really works… I got solution…
    Thanx Viral for posting this….

  29. Image DineshKumar says:

    Good Work… :)
    Thanks a lot….

  30. Image jim says:

    thanks

  31. Image ved says:

    buddy..i am working on a project and i need to disable the back button,but after my all stuffs i am still unable to do this..i don;t know why it is not working in my running project ,instead it is working in other of my team mate’s project .
    could you please tell me ,am i doing some thing wrong? why it is not working.

  32. Image Nandha says:

    Sorry My friend this code not work in Chrome

    • @Nandha – I just tried the demo in Chrome. It worked perfectly. Please check again.

  33. Image sridhar says:

    thanks alot

  34. Image smruti says:

    Nice.Thank You so much

  35. Image Joseph Elisha Bañez says:

    Thanks for the code! :)

  36. Image satyajit says:

    thanks….It works perfectly..

  37. Image aditia says:

    thanks it really help

  38. Image biju says:

    really nice!!!thank you…….

  39. Image Rajendra & Sumit says:

    Thanks Yar its Works……..

  40. Image satish says:

    when i press back button using mouse then browser shows all the history of that particular tab.
    Please help me.

  41. Image Kranthi says:

    Good job

  42. Image CAMILLE says:

    I tried your online demo but it did not work with my version of IE8. I was allowed to use the back button.

  43. Image swarnima says:

    thank you so much! It really worked well!!

  44. Image vimal says:

    thanks…Its really a very nice code…
    Great work…

  45. Image hisoka says:

    thanks .. worked perfectly
    but how can i make it navigate to an expired page instead of going to the same page

  46. Image Mukund says:

    It’s really Excellent Article

    Your Code is Really Compitable in almost all modern browser including IE, FireFox, Opera, Chrome etc.

    But I have a ?

    How to disable browser back button using server side code in asp.net using session

    Because I am using Master Page in my project

    So i can’t implement to your javascript code to disable backbutton in Master Page

    Because It will disable all web page back button so I need only to disable back button after signout/logout page

  47. Image R.J. Karthikbabu says:

    Hai.. Sir. This coding only worked on IE.

  48. Image omi says:

    i have used your code in my project..it was working fine..but when i was holding my mouse over the back button in google chrome it shows the history and from that it was possible for me to go back to the previous page..can you plz tell me some other permanent solution..so that the back button is completely disabled for a particular page..

  49. Image planetjane414 says:

    Good job!
    Thank’s a lot! :)

  50. Image jaisal says:

    Thanks , its good , great

  51. Image Raja says:

    Thanks Dude

  52. Image Hardik Soni says:

    Hi
    This script is not working in safari.

    I am checking it on safari 5.1.7.

    Please have a look at it.

    Thanks

  53. Image Prajakta says:

    Its not working with function onbeforeunload()
    Is there any way to disable back button?

    • Image Nils says:

      To disable browser’s back button “window.history.forward();” is enough, isn’t it ?
      Why do we need all other code ?
      Plzz reply fast…

      • Image Nils says:

        Oppps! it wasn’t for you but to the post…How did it go there ?

  54. Image yuda says:

    thanks for help ^^

  55. Hardik Soni is correct – this doesn’t work in Safari.

    • Image Aniruddh says:

      It does not work in safari browser because safari does not support things like window.history() and window.go() , similerly data-rel attribute is also unreliable. We can use 4mobile.Changepage() call in that case by getting pageId/url of previous page in that case

  56. Image Sashank Raj says:

    So, much thank you.

  57. Image Murthy says:

    Excellent article. But my problem is how to avoid the back button from the current page. For e.g. after session expires, it will be redirected to “sessionexpiredpage.aspx”. If user is trying to click on back button it should not go back, it should stay in the same page and user will forcefully close the browser. Appreciate if you can provide the code to handle this.

    Thanks a ton.

    • Image Prabhu says:

      Paste that javascript in pages to which you don’t want to come back again no matter what.
      Suppose Page1 is idle and redirected to Expiry Page, paste the code in Page 1 to avoid coming back to Page 1 using browser’s back button

  58. Image mudassir says:

    superb

  59. Image Scott Joplin says:

    Anyone who disables the back button of a browser is scum. Why would you want to intentionally make the internet harder for people to use? Are you trying to ensure that repeat traffic on your website is zero?

    You’re an idiot if you use this feature. A properly designed website will never, for any reason, need this feature. You’re an amature

    • Image Brandon says:

      Hi Scott,

      Everyone is entitled to their opinion, but this doesn’t only apply to the “Internet”. What if you have a web-based application (internal to your company) running on JVMs? Many web-based applications throw Java exceptions which cannot be handled when the back/refresh buttons are pressed. This action leads to null pointer exceptions in the application log, and rapid generation of many spurious objects within JVM memory, which Garbage Collection then struggles to delete. This in turn can lead to the JVM memory being maxed out, causing major performance issues and/or outages. Sounds to me like you’re the amateur…and that goes for your spelling as well.

      • Image dragunov says:

        Hi Scott,

        And sometimes due to security reason to protect data or system/application flows. Not everything is about traffic :)

    • Image ravi says:

      this is very much useful when dealing with form data where inserted data get lost so in order to prevent this is used.

  60. Image Steve says:

    Thank You so so so much dude..im a noob at this stuff and been looking for this lol

  61. I remember I needed this for a Drupal website I was building a few years ago. Fortunately, we found a Drupal Module to do the trick.

  62. Image Giuseppe says:

    Followinganother solution without using window.history:

    <script type="text/javascript">
    	function clickLink() {
    		document.getElementById("link").click();
    	}
    	
    </script>
    
    <body onload="clickLink()">
    		
    <a id="link" href="page2.html" />
    
    </body>
    

    • Image Afzal says:

      Thanks dude…

  63. Image vivek yadav says:

    Dude you are great and i truely repect you.

  64. Image Ayush says:

    This is working like a charm. Thanks a lot. Now do you know how to disable the forward as well.
    Thanks a billion.

  65. Image kkkkkkkkk says:

    function changeHashOnLoad() {
    window.location.href += “#”;
    setTimeout(“changeHashAgain()”, “50”);
    }

    function changeHashAgain() {
    window.location.href += “1”;
    }

    var storedHash = window.location.hash;
    window.setInterval(function () {
    if (window.location.hash != storedHash) {
    window.location.hash = storedHash;
    }
    }, 50);

  66. Image Thirunavukarasu says:

    Thank you so much …. Mr.Viral Patel

  67. Image Arnold says:

    Thanks Viral for sharing this. The fact that I have landed here, means I was looking for help. Those of you demeaning these solutions will one day come back to this site. There are so many practical reasons for these requirements.

  68. Image Ashish says:

    Thanks … Viral your post saved a lot of time ….

  69. Image Praveen says:

    This was of excellent help.
    Thanks for posting it .

  70. Image shoiyab says:

    Thanks

  71. Image sam says:

    thanks dude …….
    this really wark

  72. Image sam says:

    hi
    my query is
    i create a table in mysql5.5 create table data(id int NOT NULL AUTO_INCREMENT ,user varchar(30),pass varchar(20),PRIMARY KEY(id)) ENGINE=MyISAM;
    but id is not auto increment plz resolve this problem …………….

  73. Image pooja says:

    thanks …….
    this code really works and my prob. is easily solved by this code.

  74. Image pankaj wanajri says:

    Cool tricks ……….it works perfectly for me .
    Thanks buddy .

  75. Image pooja says:

    I m using the code given below n this is not working so can anybody tell me what is the problem in this code

    <script type="text/type">
    window.History.forward();
    </script>
    <%response.setHeader("Pragma","no-cache");
       response.setHeader("Cache-control","no-store");
       response.setHeader("Expires","0");
       response.setHeader("Expires","-1");%>
    

  76. Image Sweety says:

    I m using the code given below n this is not working so can anybody tell me what is the problem in this code

    window.History.forward();

  77. Image Vamsi says:

    Thank u very much its working…. i solved my problem.

  78. Image Arpit Totla says:

    Thank u…great work…

  79. Image pranay godha says:

    Thank you. it helped me.

  80. Image Gulshan says:

    Thanx…very helpful

  81. Image jiju says:

    nice..very helpful

  82. Image ravi says:

    Thanks you. Very helpful :)

  83. Image nisha says:

    i wanna such code for only single page not for entire pages. this code is working finely in entire pages not in single page. how will i do when i logout the page comletely then i click on back button nothing shoud b happen there. i can’t put these code in entire pages. i wanna such a script which we keep within logout page…….

  84. Image prapoorna says:

    Thank you so much.. you helped me a lot, it is working for browser back button and working fine for right click on browser’s back button too.

    • Image Deeksha says:

      Hi prapoorna
      Is your functionality working when you pressed back button twice or more than once?
      If yes can you please provide the solution for this?

  85. Image Deeksha says:

    Thanks Viral Your solution is working fine for me.But its working only when i click Back Button first time.When i click it twice then am getting “webpage Expired” .
    Any Solution to this Problem??

  86. Image joker says:

    thanks

  87. Image yunus says:

    Thanks viralpatel
    It’s really helpful n it works!

  88. Image jay says:

    How to disble user in ACL spring security…

  89. Image Aro says:

    Thanks dude

    help me alot

  90. thanku thanku thanku very much…….. its working dude

  91. Image dario says:

    Thanks!

  92. Image bhavana khatri says:

    this code is not work for me in my site.

  93. Image bhavana khatri says:

    One More Solution on Pageload of Master page

    Response.Cache.SetCacheability(HttpCacheability.NoCache)
    Response.Cache.SetExpires(DateTime.UtcNow.AddHours(-1))
    Response.Cache.SetNoStore()

  94. Image Anshul says:

    not working :(

  95. Image Ranjan says:

    I am a regular subscriber ….

    disable back button in jsp is not working,..Kindly suggest

  96. Image sam says:

    IT WORKS JUST LIKE ‘Viral Patel’ SAY’S.

  97. Image franco says:

    how to redirect to a different page if press back botton or refresh a page?

  98. Image bhargav says:

    hai i liked it.but i want this to happen only when click on logout button only.
    plz help

  99. Image Lawrence says:

    Thanks Boss!!

  100. Image sushma says:

    Hi i have a question, I am performing a research were i am required to disable back button. I tried your code and its working fine. but i have a timer in my second page so whenever user clicks back button in page 2 it comes back from page 1 with timer starting again. Do my question is how do i save my current state. Please guide. Appreciate your help

  101. Image Pavan says:

    Thanks that worked

  102. As far as I can tell, you do not need the

    noBack()

    function.
    You simply need to put :

    window.history.forward();


    on the page to which you would not like a history based navigation (the “Back” button in a browser).
    This works in IE8-11, FireFox, Chrome, Opera (all I tested).

    Also, it is much trickier to use the

    window.onbeforeunload

    event because it happens for many more things (like closing the window, forward button, etc) than simply the browser back button. If you are simply trying to make sure a user does not navigate away, it may work for you, but it by no means the equivalent of trapping the “Back” button.

    Thanks!
    -w

  103. nice tutorial. but does it work in all browsers.

  104. Image Lawakush Kurmi says:

    i have used this code to block (disable) back press on browser but when im clicking more than one time and pressing esc button (keyboard) then it sends to back page. what ‘s happining there pls suggest me any better solution.

  105. Image sudip says:

    Its works nicely but if you disable the back button then its look more good.
    Another thing i want to know how can I show the “session is expire” after click the logout In PHP . Plz help

  106. Image Amit says:

    Hi,

    Pls provide me example code for warning message when user clicks back button in jsp.
    or
    code for window.onbeforeunload that where to use it.

    Thanks in advance

  107. Image salimmejdoub says:

    hello i use jquery mobile
    and sorry i did not work for me what i should do
    thanks

  108. Image Santhosh K S says:

    Hi viral,
    Please post ONLINE DEMO code. u r post is very useful.

  109. Image vikas kumar says:

    Perfect, it working. Thanks very much. its very useful.

  110. Image sin says:

    Hey..!!! that worked and solved my one week’s issue…Thanks..good one!! :)

  111. Image John says:

    Is it possible to delete the client browser history and cache via js

  112. Image Dhana Shekar says:

    Thank you Viral:-)

  113. Image Kavivarman says:

    Thanks a lot to all….

  114. Image Yohan Dedik Irawan says:

    Thanks a lot… This solve my problem.

  115. Image Ziaul Kamal says:

    how to mix a content to random post if user click back button browser ?

    mail to me;;;;

  116. Image model rumah says:

    hay, i wist try ini blogspot, but not work, can you give mu advice ??
    thansk

  117. Image berbagi73 says:

    Where should I place the code?

  118. Image Priya says:

    Its good. How can I achieve this functionality in angular 6

Leave a Reply

Your email address will not be published. Required fields are marked *