最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Disable browsers' back button, completely - Stack Overflow

programmeradmin2浏览0评论

Need to prevent users going to the previous page, pletely.

When I use the following code it works but it's not what I need exactly. When pressing the back button it says "Document Expired":

Response.Cache.SetExpires(DateTime.UtcNow.AddDays(-1));
Response.Cache.SetValidUntilExpires(false);
Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetNoStore();

Another idea - to open a new window without toolbar:

<script>
    function PopupWithoutToolbar(link) {
        var w = window.open(link.href,
            link.target || "_blank",
            'menubar=no,toolbar=no,location=no,directories=no,status=no,scrollbars=no,resizable=no,dependent,width=800,height=620,left=0,top=0');
        return w ? false : true;
    }
</script>

<a href="" onclick="return PopupWithoutToolbar(this)">yahoo</a>

But, still... If the user presses the backspace button on a keyboard he can go back. It seems that this approach is only for hiding and not disabling buttons.

Is there any way to simply ignore the back button?

Need to prevent users going to the previous page, pletely.

When I use the following code it works but it's not what I need exactly. When pressing the back button it says "Document Expired":

Response.Cache.SetExpires(DateTime.UtcNow.AddDays(-1));
Response.Cache.SetValidUntilExpires(false);
Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetNoStore();

Another idea - to open a new window without toolbar:

<script>
    function PopupWithoutToolbar(link) {
        var w = window.open(link.href,
            link.target || "_blank",
            'menubar=no,toolbar=no,location=no,directories=no,status=no,scrollbars=no,resizable=no,dependent,width=800,height=620,left=0,top=0');
        return w ? false : true;
    }
</script>

<a href="http://www.google." onclick="return PopupWithoutToolbar(this)">yahoo</a>

But, still... If the user presses the backspace button on a keyboard he can go back. It seems that this approach is only for hiding and not disabling buttons.

Is there any way to simply ignore the back button?

Share Improve this question asked Jun 14, 2017 at 19:19 DimitriDimitri 1492 gold badges4 silver badges19 bronze badges 3
  • 1 stackoverflow./questions/12381563/… – amiramw Commented Jun 14, 2017 at 19:24
  • 1 You might want to reconsider doing this. A back button is one of the most basic and well known functions of a browser (even my grandma knows about it). Disabling it or changing it's function results in a terrible user experience since the user will probably think that their browser crashed or their mouse is busted since something will (not) happens that has always worked. – VDWWD Commented Jun 14, 2017 at 20:28
  • Does this answer your question? How can I stop the browser back button using JavaScript? – Michael Freidgeim Commented Jan 17, 2024 at 11:16
Add a ment  | 

5 Answers 5

Reset to default 3

I'm using a slightly different solution:

history.pushState(null, null, location.href);
window.onpopstate = function () {
    history.go(1);
}

To disable the back button in the browser you can use use the following code in your JavaScript on the page on which you want to disable the back button.

<script>
history.pushState(null, null, location.href);
    window.onpopstate = function () {
        history.go(1);
    };
</script>

Based on your post it sounds like your only issue is disabling the backspace button from allowing the user to go back.

Here's what I do for that using jquery. Still allows backspace to work inside enabled text editing inputs, where it should.

    // Prevent the backspace key from navigating back.
    $(document).unbind('keydown').bind('keydown', function (event) {
        var doPrevent = false;
        if (event.keyCode === 8) {
            var d = event.srcElement || event.target;
            if ((d.tagName.toUpperCase() === 'INPUT' && (d.type.toUpperCase() === 'TEXT' ||
                                                         d.type.toUpperCase() === 'PASSWORD' ||
                                                         d.type.toUpperCase() === 'FILE')) ||
                                                         d.tagName.toUpperCase() === 'TEXTAREA') {
                doPrevent = d.readOnly || d.disabled;
            }
            else {
                doPrevent = true;
            }
        }

        if (doPrevent) {
            event.preventDefault();
        }
    });

I am not entirely sure if this will work, but you can try handling the event with javascript.

Like if you want to entirely disable the backspace button from allowing users to go back you can do like

$(window).on("keypress", function (e){
    if(e.keycode == "backspace") 
         e.preventDefault();
})

I could figure out the keycode for backspace for you , but that isn't too hard to figure out. Also this uses jquery, but you can use just raw javascript. just wasn't sure what it would be offhand.

Simplest thing ever:

window.onhashchange = function (event) {
 //blah blah blah
 event.preventDefault();
 return false;
}

You can handle the location domain etc from that (window.location) then cancel the event if you want in this case.

How to Detect Browser Back Button event - Cross Browser

发布评论

评论列表(0)

  1. 暂无评论