Предотвращение пересылки BACKSPACE с помощью jQuery (например, Домашняя страница Google)

Ответ 1

Я привязал обработчик событий к keydown и предотвратил действие по умолчанию этого события, если мы имеем дело с ключом backspace вне textarea или input:

$(document).on("keydown", function (e) {
    if (e.which === 8 && !$(e.target).is("input, textarea")) {
        e.preventDefault();
    }
});

Ответ 2

Мне очень нравится ответ Эндрю Уитакер. Тем не менее, он будет перемещаться назад, если сосредоточиться на поле ввода только для чтения, радио или флажка, и не позволит использовать backspace для элементов contentEditable, поэтому я добавил небольшую модификацию. Кредит принадлежит Эндрю Уитакеру.

$(document).on("keydown", function (e) {
    if (e.which === 8 && !$(e.target).is("input:not([readonly]):not([type=radio]):not([type=checkbox]), textarea, [contentEditable], [contentEditable=true]")) {
        e.preventDefault();
    }
});

В настоящий момент кажется необходимым иметь все варианты [contentEditable], которые находятся в HTML, поскольку [contentEditable]!= [contentEditable = true].

Ответ 3

То, как Google делает это, классно. Когда вы нажимаете backspace, они фокусируют текстовое поле. Предотвращение перехода пользователей обратно!

Вы можете попробовать то же самое:

<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<input id="target" type="text" />

<script type="text/javascript">
$(document).keydown(function(e) { if (e.keyCode == 8) $('#target').focus(); });
</script>

demo: http://jsfiddle.net/epinapala/TxG5p/

Ответ 4

Для остановки навигации просто этот код работает!

$(document).on("keydown", function (event) {        
   if (event.keyCode === 8) {
      event.preventDefault();
    }
  });

Но это также произойдет и для полей ввода типа text/textarea. Чтобы ограничить его для этих полей, вы можете использовать

$(document).on("keydown", function (event) {
  if (event.which === 8 && !$(event.target).is("input, textarea")) {
   event.preventDefault();
  }
});

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

$('#myField').on("keydown", function (event) {
  if (event.keyCode === 8 || event.which === 8) { 
   event.preventDefault(); 
  } 
});

Я думал упомянуть кого-нибудь, чтобы помочь; -)

Ответ 5

Вот простое решение, протестированное в IE, Chrome и Firefox.

$(document).on("keydown", function (event) {
// Chrome & Firefox || Internet Explorer
if (document.activeElement === document.body || document.activeElement === document.body.parentElement) {
    // SPACE (32) o BACKSPACE (8)
    if (event.keyCode === 32 || event.keyCode === 8) {
        event.preventDefault();
    }
}});

Ответ 6

Это старый, но эти ответы по-прежнему позволят вам вернуться и перемещаться, когда сфокусированы на переключателе. Вы также захотите отфильтровать тип ввода. Примите во внимание все приведенные выше ответы:

$(document).on("keydown", function (e) {
    if (e.which === 8 && !$(e.target).is("input[type='text']:not([readonly]), textarea")) {
        e.preventDefault();
    }
});

Ответ 7

Я пробовал многие из фрагментов кода в Интернете без удовлетворения. Новые версии браузера IE (IE11) и Crome нарушили мое прежнее решение, но вот что работает для меня с IE11 + Crome + Firefox. Код предотвращает обратное пространство, и пользователь не теряет ничего из того, что он ввел в текстовое поле:

window.addEventListener('keydown', function (e) {
    if (e.keyIdentifier === 'U+0008' || e.keyIdentifier === 'Backspace' || e.keyCode === '8' || document.activeElement !== 'text') {
        if (e.target === document.body) {
            e.preventDefault();
        }
    }
}, true);

Ответ 8

Для Internet Explorer это сработало для меня:

window.addEventListener('keydown', function (e) {

    if (e.keyCode === 8) {
        if (e.target === document.body) {
        e.preventDefault();
        }
    }
}, true);

Ответ 9

Обработанные текстовые поля только для чтения также

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