Как отключить backspace, если что-либо, кроме поля ввода, сосредоточено на использовании jquery

Как отключить нажатие клавиши backspace, если что-либо, кроме 2 определенных полей ввода, сосредоточено на использовании jquery?

вот мой текущий код (теперь включая 2 текстовых поля):

$(document).keypress(function(e){
  var elid = $(document.activeElement).attr('id');
  if(e.keyCode === 8 && elid != 'textbox1' || elid != 'textbox2'){
      return false;
  };
});

это не работает....есть идеи?

9 ответов


Я думаю, что это будет делать трюк:

$(document).keydown(function(e) {
    var elid = $(document.activeElement).hasClass('textInput');
    if (e.keyCode === 8 && !elid) {
        return false;
    };
});

предполагая, что текстовые поля имеют класс textInput.

вот рабочий пример


это отключит backspace на вашем сайте без необходимости добавлять определенные классы в поля ввода. Чтобы отключить backspace, кроме случаев использования полей ввода, используйте .is ("вход:фокус") Если вы хотите отключить backspace, за исключением случаев использования текстовых полей, используйте .is ("ввод:фокус, textarea:фокус")

$(document).keypress(function(e){ 
    var elid = $(document.activeElement).is("input:focus"); 
    if(e.keyCode === 8 && !elid){ 
       return false; 
    }; 
});

решение Hudson-Peralta + QF_Developer отлично, но у него есть один недостаток:
Если вы сосредоточены на переключателе или флажке, кнопка backspace все равно отбросит вас со страницы. Вот модификация, чтобы избежать этого разрыва:

$(document).keydown(function(e){ 
  var elid = $(document.activeElement).is('input[type="text"]:focus, textarea:focus'); 
    if(e.keyCode === 8 && !elid){ 
      return false; 
    }; 
});

редактировать 20130204:
keypress() заменить на keydown()!
Код выше теперь работает правильно.

редактировать 20151208:
Как упоминалось в комментарии @outofmind больше типов ввода, которые могут отбросить вас назад при нажатии backspace. Пожалуйста, добавьте в разделенный запятыми список селекторов метода is () любой тип полей ввода, которые позволяют прямой ввод символов и которые действительно используются в вашем HTML-коде, например input[type="password"]:focus, input[type="number"]:focus или input[type="email"]:focus.


Я думаю, что для обработки текстовых полей требуется небольшая модификация:

var elid = $(document.activeElement).is("input:focus, textarea:focus"); 

я внес небольшое изменение в принятый ответ, который может быть кому-то полезен:

$(document).keydown(function(e) {
    var elid = $(document.activeElement).is("input, textarea") ;
    if (e.keyCode === 8 && !elid) {
        if(e.ctrlKey) {
            window.history.back()
        }
        else {
            alert("Navigating with Backspace has been disabled. Use CTRL + Backspace if you want to go back to the previous page (and lose any unsaved changes).");
            return false;
        }
    }
});

С помощью этого метода пользователь все еще может перемещаться с помощью Backspace, удерживая CTRL, но также учитывает textarea а также любой input.

конечно, альтернативой является использование чего-то вроде этой вместо этого, что не позволяет пользователю покидать страницу, если они ввели что-либо.


@Nick Craver, позорный ответ по нескольким причинам. Отвечай на вопрос или хотя бы снисходительно.

вот решение на основе прототипа, которое я использовал для своих форм, потому что пользователи жаловались, что backspace заберет их из формы (что является такой явно противоречащей интуиции вещью, интересно, почему все браузеры используют клавишу backspace в качестве кнопки "Назад").




        // event handlers must be attached after the DOM is completely loaded
        Event.observe(window, 'load', function() {
          // keypress won't fire for backspace so we observe 'keydown'
          Event.observe(window, 'keydown', function(event){
            // 8 == backspace
            if( event.keyCode == 8) {
                // with no field focused, the target will be HTMLBodyElement
               if( event.target == document.body) {
                  // stop this event from propagating further which prevents                      
                  // the browser from doing the 'back' action
                  event.stop();
               }
             }
          });
        });


ответ Хадсона-Перальты работал хорошо для меня, но я сделал небольшую модификацию, так как я использую много событий keydown:

$(document).keydown(function(e){ 
            var elid = $(document.activeElement).is("input:focus"); 
            if(e.keyCode === 8 && !elid){ 
               e.preventDefault(); 
            }; 
        });

Я тоже много работал над тем же. Наконец, я нашел ответ, и для удобства всех я разместил решение на http://blog.totusinfo.com/jquery-disable-backspace-for-document-history-except-inputs-and-textarea/


Я изменил ответ немного больше, чтобы объединить хороший ответ каждого
1. используется селектор "input[type=text]:focus, textarea: focus" для поддержания поведения по умолчанию для этих элементов и, как сказал JPsy, для предотвращения поведения по умолчанию на входах, таких как checkbox
2. используется e.цель вместо этого сделать код зависит исключительно от JQuery, так как я не уверен, что каждый документ поддержки браузера.activeElement ну

редактировать
3. Включать пароль поле также можно добавить "ввод[type=password]: фокус",

     $(document).keydown(function(e){

          var code=e.keyCode;
          var is_to_stop= (!$(e.target).is("input[type=text]:focus, input[type=password]:focus, textarea:focus")) && (code==8);
          if(is_to_stop){
            return false;
          }

    });