1. ホーム
  2. ジャバスクリプト

[解決済み】バックスペースキーで戻ることができないようにするには?

2022-04-19 21:30:45

質問

IEでは、(ひどく非標準的だが、動作する)jQueryでこれを行うことができます。

if ($.browser.msie)
    $(document).keydown(function(e) { if (e.keyCode == 8) window.event.keyCode = 0;});

しかし、Firefoxで動く方法で、あるいはおまけにクロスブラウザでできるのだろうか。

念のため。

$(document).keydown(function(e) { if (e.keyCode == 8) e.stopPropagation(); });

は何もしません。

$(document).keydown(function(e) { if (e.keyCode == 8) e.preventDefault(); });

は問題を解決しますが、バックスペースキーがページ上で使用できなくなり、元の動作よりさらに悪化します。

EDIT なぜこのようなことをするかというと、私は単純なウェブページではなく、大規模なアプリケーションを作成しているからです。バックスペースを押す場所を間違えただけで、10分の作業が失われるのは信じられないほど迷惑な話です。バックスペースキーで戻ることができないようにすることで、ミスを防ぐこととユーザーに迷惑をかけることの比率は1000/1をはるかに超えるはずです。

EDIT2: 私は ではなく 履歴のナビゲーションを防ごうとしているのであって、単なる事故です。

EDIT3です。brentonstrinesのコメント(質問が人気なのでこちらに移動しました)。これは長期的な'修正'ですが、'修正'の代わりに webkitでこの動作を変更するChromiumのバグ

解決方法は?

このコードは、少なくともIEとFirefoxで問題を解決します(他のブラウザではテストしていませんが、問題が他のブラウザにも存在するのであれば、動作する合理的な可能性を与えます)。

// Prevent the backspace key from navigating back.
$(document).unbind('keydown').bind('keydown', function (event) {
    if (event.keyCode === 8) {
        var doPrevent = true;
        var types = ["text", "password", "file", "search", "email", "number", "date", "color", "datetime", "datetime-local", "month", "range", "search", "tel", "time", "url", "week"];
        var d = $(event.srcElement || event.target);
        var disabled = d.prop("readonly") || d.prop("disabled");
        if (!disabled) {
            if (d[0].isContentEditable) {
                doPrevent = false;
            } else if (d.is("input")) {
                var type = d.attr("type");
                if (type) {
                    type = type.toLowerCase();
                }
                if (types.indexOf(type) > -1) {
                    doPrevent = false;
                }
            } else if (d.is("textarea")) {
                doPrevent = false;
            }
        }
        if (doPrevent) {
            event.preventDefault();
            return false;
        }
    }
});