Javascript: Как заблокировать символ backspace?

Ответ 1

Решение. Поместите следующий код в конец всех ваших страниц, содержащих формы:

<!-- Block the Backspace and Enter keys in forms, outside of input texts and textareas -->
<script type="text/javascript">
    function blockBackspaceAndEnter(e) {
        if (!e) { // IE reports window.event instead of the argument
            e = window.event;
        }
        var keycode;
        if (document.all) {
            // IE
            keycode = e.keyCode;
        } else {
            // Not IE
            keycode = e.which;
        }
        // Enter is only allowed in textareas, and Backspace is only allowed in textarea and input text and password
        if ((keycode == 8
                && e.srcElement.type != "text"
                && e.srcElement.type != "textarea"
                && e.srcElement.type != "password")
                || (keycode == 13 && e.srcElement.type != "textarea")) {
            e.keyCode = 0;
            if (document.all) {
                // IE
                event.returnValue = false;
            } else {
                // Non IE
                Event.stop(e);
            }
        }
    }
    for (var i = 0; i < document.forms.length; i++) {
        document.forms[i].onkeydown = blockBackspaceAndEnter;
    }
</script>

У меня есть следующие комментарии о том, что другие люди ответили здесь раньше:

Кто-то сказал:

"Пожалуйста, не надо. Забой к гоу-обратно; возвращение назад одна из самых важных функций браузера и сломать его невыносимо грубо".

Мой ответ ему:

Да, обычно люди используют обратную кнопку для возврата, но не на страницы с FORMS. С другой стороны, людям очень легко случайно щелкнуть рядом или вне текста ввода или текстовое поле, а затем нажмите кнопку "Назад", чтобы они потеряли все свои правки, как заметил еще кто-то:

"Пользователи не находятся в текстовом поле и backspace, полностью потеряв все которые они только что ввели. Обычно это не проблема, но для нас мы заполняем много текста на длинных формах состояний".

То же самое нежелательное поведение можно также сказать о клавише Enter, чтобы отправить форму, что обычно желательно (если вообще когда-либо) для небольших форм с несколькими полями, но не для форм со многими поля и поля выбора, поля ввода и текстовые поля, в которых большую часть времени вы НЕ хотите, чтобы форма была отправлена ​​при нажатии Enter.

Вот почему я предлагаю код выше, который применяется ко всем <FORM> теги функции, предлагаемые webster, но без проверок ALT, которые, как мне кажется, не являются полезными, и без проверок для CTRL + N и CTRL + R и CTRL + F5, которые мы не хотим блокировать, потому что когда они используются, они НЕ являются случайными.

К сожалению, код выше не работает в Firefox, когда у вас есть DIV и TABLE внутри вашей FORM! Это связано с тем, что событие keydown, похоже, не распространяется на содержащую форму, и вместо этого используется поведение по умолчанию (UNDESIRED!) Для клавиш Backspace и Enter. Я еще не нашел решение для этого...

Ответ 2

Как уже упоминалось, существуют методы, в которых вы можете отслеживать события ключевого слова backspace и выполнять разные действия.

Я рекомендую не перехватывать ключ backspace по нескольким причинам:

1) Просто раздражающие и раздраженные пользователи, скорее всего, не вернутся на вашу страницу.

2) Backspace - это не единственный метод возврата на предыдущую страницу. Существуют и другие комбинации клавиш, которые могут выполнять одно и то же, а также очевидную кнопку "назад".

Не делайте этого, но если вам нужно, используйте onbeforeunload() вместо того, чтобы улавливать штрихи в браузере.

Ответ 3

Вы можете использовать свойство onbeforeunload в теге body, чтобы пригласить пользователя покинуть страницу.

Ответ 4

Вы можете просто использовать следующие фрагменты кода, чтобы заблокировать обратное пространство, когда курсор находится в техасе, текстовом и пароле.

function onKeyDown() 
{    
    if((event.altKey) || ((event.keyCode == 8) &&
        (event.srcElement.type != "text" &&
        event.srcElement.type != "textarea" &&
        event.srcElement.type != "password")) ||
        ((event.ctrlKey) && ((event.keyCode == 78) || (event.keyCode == 82)) ) || (event.keyCode == 116) ) {
    event.keyCode = 0;
    event.returnValue = false;}
 } 

Вызвать эту функцию из тега body onkeydown

Ответ 5

Filme Noi Cinema имеет правильный ответ, но примерный код немного устарел. Мне просто нужно было это решение, поэтому я подумал, что отправлю код, который я использовал.

//I use the standard DOM method for accessing the body tag, because the
//non-standard HTML DOM shortcuts are not stable.  The correct behavior is
//dynamically attached to the entire body using the onkeypress event, which
//is the most stable event to target cross browser.
document.getElementsByTagName("body")[0].onkeypress = function (event) {
    var a = event || window.event, //get event cross browser
        b = a.target || a.srcElement; //get source cross browser

    //the only thing that matters is the backspace key
    if (a.keyCode === 8) {

        //if you are a textarea or input type text or password then fail
        if (b.nodeName === "textarea" || (b.nodeName === "input" && (b.getAttribute("type") === "text" || b.getAttribute("type") === "password"))) {
            return true;
        } else {

            //backspace is disabled for everything else
            return false;
        }
    }
};

Этот код должен быть выполнен до того, как пользователь начнет привлекать страницу. Существует множество способов сделать это:

• Вы можете поместить вышеуказанный код в любую функцию, которая уже прикреплена к событию onload.
• Вы можете обернуть вышеуказанный код, привязанный к событию onload на странице.
• Вы можете поместить вышеуказанный код в функцию самозапуска.

Примеры:

//self executing function
(function () {
    the solution code here
}());

//wrapper to onload event
document.getElementsByTagName("body")[0].onload = function () {
    the solution code here
};

Я добавляю этот код в Pretty Diff, если вы хотите увидеть пример в действии.

Ответ 6

Вы должны иметь возможность подключить к окну прослушиватель onKeydown/Up/Press. В этой функции обратите внимание на нажатый ключевой код и на цель события. Если ключевой код является обратным пространством, и цель НЕ является полем ввода или текстовым полем, предотвратите событие.

Ответ 7

Наконец-то я нашел тот, который работает во всех браузерах.

Это Хазем Салех Его адрес веб-сайта: http://www.technicaladvices.com/2012/07/16/preventing-backspace-from-navigating-back-in-all-the-browsers/

/*Starts here:*/

  document.onkeydown = function (event) {

    if (!event) { /* This will happen in IE */
        event = window.event;
    }

    var keyCode = event.keyCode;

    if (keyCode == 8 &&
        ((event.target || event.srcElement).tagName != "TEXTAREA") && 
        ((event.target || event.srcElement).tagName != "INPUT")) { 

        if (navigator.userAgent.toLowerCase().indexOf("msie") == -1) {
            event.stopPropagation();
        } else {
            alert("prevented");
            event.returnValue = false;
        }

        return false;
    }
  };  
/*Ends Here*/