Disable Back Button in Browser using jquery?

Question

I would like to Disable Back button when user click on logoff for this i delete only cookies of that user not session in my application. And want to disable Back button

if(getCookie('username') == ""){
   Disable back button;// we use "window.history.redirect" for javascript i look jquery for this

}

Please help me..

Not possible AFAIK. And if your application is not able to handle simple session cookie issues, crippling the users browser is NOT the right way to solve it. Build a robust session management instead. — selfawaresoup, Jul 16 '10 at 06:21
Since you get the session id it wont affect the browser back. because before setting the session the browser back button should be blocked. (i.e) By default it should be blocked. In other terms, the browser with back button will do it. — King of kings, Nov 26 '14 at 10:40

reza gholami · Answer 1 · 2017-04-03T06:06:30.543

28

you must push your url in pushState and clean the browser history:

try this :

$(document).ready(function() {
        window.history.pushState(null, "", window.location.href);        
        window.onpopstate = function() {
            window.history.pushState(null, "", window.location.href);
        };
    });

edited Apr 03 '17 at 06:06

answered Feb 18 '17 at 14:46

reza gholami

281
3
3

5

It stopped working in recent upgraded Chrome 76. trying to find our another way but no luck yet. – Zack Aug 13 '19 at 12:01
@Zack did you find new solution? – Mahsa Seifikar Jun 14 '22 at 16:32

score 9 · Answer 2 · edited Mar 03 '18 at 04:12

Use following code as it is:

window.onload = function () {
    if (typeof history.pushState === "function") {
        history.pushState("jibberish", null, null);
        window.onpopstate = function () {
            history.pushState('newjibberish', null, null);           
        };
    }
    else {
        var ignoreHashChange = true;
        window.onhashchange = function () {
            if (!ignoreHashChange) {
                ignoreHashChange = true;
                window.location.hash = Math.random();                
            }
            else {
                ignoreHashChange = false;   
            }
        };
    }
};

not working please suggest something else – Akash lal Jan 13 '21 at 07:58 — Akash lal, Jan 13 '21 at 07:58

score 5 · Answer 3 · edited Nov 29 '12 at 13:50

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.

CODE:

<HTML>
    <HEAD>
        <SCRIPT type="text/javascript">    
             window.history.forward();
             function noBack() { 
                  window.history.forward(); 
             }
        </SCRIPT>
    </HEAD>
    <BODY onload="noBack();" onpageshow="if (event.persisted) noBack();" onunload="">
    </BODY>
</HTML>

score 4 · Answer 4 · answered Feb 03 '16 at 17:15

4

var path = 'Test.aspx'; //write here name of your page 
history.pushState(null, null, path + window.location.search);
window.addEventListener('popstate', function (event) {
    history.pushState(null, null, path + window.location.search);
});

This works across all browsers(except < IE10) even if urls have query strings appended.

For this you don't even need jquery.

have a look here to apply this for your page.

answered Feb 03 '16 at 17:15

Cheezy Code

1,685
1
14
18

This code only works when executed manually from console – Pedro Joaquín Jul 23 '20 at 19:42

score 2 · Answer 5 · edited Feb 14 '14 at 19:50

2

This will work, it worked for me as I am dealing with mobile browsers, android and ios.

window.history.forward();
window.onload = function()
{
  window.history.forward();
};

window.onunload = function() {
  null;
};

edited Feb 14 '14 at 19:50

nKn

13,691
9
45
62

answered Feb 14 '14 at 19:31

Ragu

21
1

score 1 · Answer 6 · answered Apr 28 '15 at 15:33

Sunil was correct, but to use jQuery paste the code below into any page that you want to prevent going back too. I tested this in IE 11, chrome and FF, which worked fine.

$(document).ready(function () {
    function disableBack() {window.history.forward()}

    window.onload = disableBack();
    window.onpageshow = function (evt) {if (evt.persisted) disableBack()}
});

FK82 · Answer 7 · 2010-07-16T06:16:44.100

This is not exactly your approach, but you may disable the navigation panel of any window using plain javascript. Just set window.menubar and window.toolbar visibility to false as follows,

window.menubar.visible = false ;
window.toolbar.visible = false ;

Update:

Changing the menubar and toolbar visibility of an existing window seems to violate security protocols. (https://developer.mozilla.org/en/DOM/window.menubar)

Therefore the only real way is to open a new window with menubar and toolbar set to "no" in the first place:

window.open(url,name,"menubar=no,toolbar=no[, additional options]",true) ;

If you set the replace argument (the last argument) to true the new window should also inherit the history of the window it was opened in.

Check https://developer.mozilla.org/en/DOM/window.open and http://msdn.microsoft.com/en-us/library/ms536651(VS.85).aspx for reference.

-: not working in eg. ff. +: good idea, but the safest way for disabling menu is opening a new window and set proper options! — , Jul 14 '10 at 06:04
Is there any other way to do the same thing? because i am stuck on this problem so plz help me.... — user380979, Jul 16 '10 at 04:47

score 0 · Answer 8 · answered Oct 19 '13 at 05:52

0

Simple logic: move forward when click forward

function preventBack() {
    window.history.forward();
}
 window.onunload = function() {
    null;
};
setTimeout("preventBack()", 0);

Keep this js code in your page it works.

answered Oct 19 '13 at 05:52

saidesh kilaru

740
2
10
18

score 0 · Answer 9 · answered Jul 20 '21 at 17:08

Preventing a user from accessing pages in a secured application can be achieved by adding something like what is shown below to your web pages.

A full example using Apache Shiro is available here:

https://github.com/NACHC-CAD/web-security-example/releases/tag/v2.0.0

<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />
<meta http-equiv="CACHE-CONTROL" content="NO-CACHE" />

<script>
    if(performance.navigation.type == 2){
        console.log("Doing reload");   
        location.reload(true);
        console.log("Done with reload");
    }
    console.log("Script loaded.")
</script>

Disable Back Button in Browser using jquery?

9 Answers9

Linked

Related