В 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(); });
решает проблему, но делает клавишу Backspace непригодной для использования на странице, что еще хуже, чем исходное поведение.
РЕДАКТИРОВАТЬ: Причина, по которой я это делаю, заключается в том, что я не создаю простую веб-страницу, а большое приложение. Потерять 10 минут работы невероятно раздражает только потому, что ты нажал клавишу возврата в неправильном месте. Соотношение предотвращения ошибок и раздражающих пользователей должно быть намного выше 1000/1 за счет предотвращения возврата клавиши назад.
РЕДАКТИРОВАТЬ 2: Я не пытаюсь предотвратить историю навигации, просто несчастные случаи.
EDIT3: комментарий @brentonstrines (перенесен сюда, поскольку вопрос очень популярен): это долгосрочное «исправление», но вы можете оставить свою поддержку за ошибкой Chromium, чтобы изменить это поведение в webkit
источник
Ответы:
Этот код решает проблему, по крайней мере, в IE и Firefox (не тестировал ни один другой, но я даю ему разумную возможность работать, если проблема существует даже в других браузерах).
источник
d.type.toUpperCase() === 'PASSWORD'
также. В остальном хорошо выглядитif( $(d).is( ":input" ) )...
d.isContentEditable
здесь.Этот код работает во всех браузерах и глотает клавишу возврата, когда его нет в элементе формы или если элемент формы отключен | readOnly. Он также эффективен, что важно, когда он выполняется для каждого введенного ключа.
источник
if(!rx.test(e.target.tagName) || $(e.target).is(':checkbox') || $(e.target).is(':radio') || $(e.target).is(':submit') || e.target.disabled || e.target.readOnly )
contentEditable
..is(':checkbox,:radio,:submit')
Другие ответы здесь доказали, что это невозможно сделать без элементов белого списка, в которых разрешен Backspace. Это решение не является идеальным, потому что белый список не так прост, как просто текстовые поля и ввод текста / пароля, но он часто оказывается неполным и нуждается в обновлении.
Однако, поскольку целью подавления функциональности backspace является просто предотвращение случайной потери данных пользователями, решение beforeunload является хорошим решением, поскольку модальное всплывающее окно вызывает удивление - модальные всплывающие окна плохие, когда они запускаются как часть стандартного рабочего процесса, потому что пользователь привыкает отклонять их, не читая их, и они раздражают. В этом случае модальное всплывающее окно появляется только в качестве альтернативы редкому и неожиданному действию и поэтому является приемлемым.
Проблема заключается в том, что модал onbeforeunload не должен появляться, когда пользователь уходит со страницы (например, при нажатии на ссылку или при отправке формы), и мы не хотим создавать белый или черный список определенных условий onbeforeunload.
Идеальная комбинация компромиссов для обобщенного решения заключается в следующем: следите за тем, нажата ли клавиша Backspace, и вынимайте только режим onbeforeunload, если он есть. Другими словами:
Это было проверено на работу в IE7 +, FireFox, Chrome, Safari и Opera. Просто поместите эту функцию в ваш global.js и вызывайте ее с любой страницы, где вы не хотите, чтобы пользователи случайно потеряли свои данные.
Обратите внимание, что модальное состояние onbeforeunload может быть запущено только один раз, поэтому, если пользователь снова нажимает клавишу Backspace, модальное соединение не будет запускаться снова.
Обратите внимание, что это не сработает при событиях hashchange, однако в этом контексте вы можете использовать другие методы, чтобы предотвратить случайную потерю данных пользователями.
источник
Более элегантное / краткое решение:
источник
Модификация ответа erikkallen для адресации различных типов ввода
Я обнаружил, что предприимчивый пользователь может нажимать клавишу Backspace на флажок или переключатель в тщетной попытке очистить его, и вместо этого они будут перемещаться назад и потерять все свои данные.
Это изменение должно решить эту проблему.
Новое редактирование для редактирования содержимого div
Пример
Для тестирования сделайте 2 файла.
starthere.htm - сначала откройте его, чтобы у вас было место, куда можно вернуться
test.htm - Это будет навигация в обратном направлении, когда нажата клавиша Backspace, в то время как флажок или отправить имеет фокус (достигается путем вкладки). Замените моим кодом, чтобы исправить.
источник
Судя по комментариям, вы хотите, чтобы люди не теряли информацию в формах, если они нажимают клавишу возврата, чтобы удалить, но поле не сфокусировано.
В этом случае вы хотите посмотреть на обработчик события onunload . Stack Overflow использует его - если вы попытаетесь покинуть страницу, когда начали писать ответ, появится всплывающее предупреждение.
источник
Стоп от навигации этот код работает!
Но не для ограничения текстовых полей, а других
Чтобы предотвратить это для конкретной области просто используйте
Обращаясь к этому ниже!
Запретить BACKSPACE вернуться назад с помощью jQuery (как на главной странице Google)
источник
Большинство ответов в JQuery. Вы можете сделать это идеально в чистом Javascript, простом и не требующем библиотеки. Эта статья была хорошей отправной точкой для меня, но поскольку keyIdentifier устарел, я хотел, чтобы этот код был более безопасным, поэтому я добавил || e.keyCode == 8 в оператор if. Кроме того, код не очень хорошо работал в Firefox, поэтому я добавил return false; и теперь это работает на отлично Вот:
Этот код прекрасно работает, потому что,
источник
Объединение решений от "thetoolman" && "Biff MaGriff"
следующий код, кажется, работает правильно в IE 8 / Mozilla / Chrome
источник
Не уверен, почему никто просто не ответил на это - кажется вполне разумным техническим вопросом, чтобы спросить, возможно ли это.
Нет, я не думаю, что есть кросс-браузерный способ отключения кнопки возврата. Я знаю, что в эти дни он не включен по умолчанию в FF.
источник
Мне было трудно найти ответ не из JQUERY. Спасибо Стасу за то, что поставил меня на трассу.
Chrome: если вам не нужна поддержка нескольких браузеров, вы можете просто использовать черный список, а не белый список. Эта чистая версия JS работает в Chrome, но не в IE. Не уверен насчет FF.
В Chrome (версия 36, середина 2014 г.), кажется, нацелены клавиши, не входящие или не подлежащие удовлетворению
<BODY>
. Это позволяет использовать черный список, который я предпочитаю белый список. IE использует цель последнего клика - так что это может быть div или что-то еще. Это делает это бесполезным в IE.Кросс-браузер: для чистого javascript я нашел ответ Стаса лучшим. Добавление еще одной проверки условия для contenteditable заставило меня работать *:
* Обратите внимание, что в IE [edit: и Spartan / TechPreview] есть «функция», которая делает элементы, связанные с таблицей, недоступными для редактирования. . Если вы нажмете одну из них, а затем нажмите клавишу Backspace, она вернется назад. Если у вас нет редактируемых
<td>
s, это не проблема.источник
Это решение аналогично другим, которые были опубликованы, но оно использует простой белый список, что делает его легко настраиваемым, чтобы разрешить возврат в заданных элементах, просто установив селектор в функции .is ().
Я использую это в этой форме, чтобы предотвратить возврат назад на страницы:
источник
Чтобы немного пояснить отличный ответ @ erikkallen , вот функция, которая позволяет вводить все типы ввода с клавиатуры, в том числе введенные в HTML5 :
источник
JavaScript - способ jQuery:
Javascript - родной способ, который работает для меня:
источник
У меня были некоторые проблемы с принятым решением и плагином Select2.js; Мне не удалось удалить символы в редактируемом поле, поскольку действие по удалению было предотвращено. Это было мое решение:
Select2 создает Span с атрибутом «contentEditable», который имеет значение true для редактируемого поля со списком в нем. Я добавил код в учетную запись для тегов spanName и другого атрибута. Это решило все мои проблемы.
Редактировать: Если вы не используете плагин комбобокса Select2 для jquery, то это решение может вам не понадобиться, и принятое решение может быть лучше.
источник
источник
Этот код решает проблему во всех браузерах:
источник
DIV
илиTD
.Самый простой способ предотвратить навигацию при нажатии на клавишу возврата
источник
Используя Dojo toolkit 1.7, это работает в IE 8:
источник
Вы пробовали очень простое решение, просто добавив следующий атрибут в текстовое поле только для чтения:
onkeydown = "вернуть ложь";
Это не позволит браузеру вернуться в историю, когда клавиша Backspace нажата в текстовом поле только для чтения. Может быть, я упускаю ваше истинное намерение, но, похоже, это было бы самым простым решением вашей проблемы.
источник
Гораздо более аккуратное решение -
Кроме того, вы можете только проверить, если
источник
Чистая версия JavaScript, которая работает во всех браузерах:
Конечно, вы можете использовать «INPUT, TEXTAREA» и использовать «if (! Regex.test (elements))» затем. Первый работал нормально для меня.
источник
Производительность?
Я беспокоился о производительности и сделал скрипку: http://jsfiddle.net/felvhage/k2rT6/9/embedded/result/
Я проанализировал наиболее перспективные методы, которые я нашел в этой теме. Оказывается, все они были очень быстрыми и, скорее всего, не вызывали проблем с точки зрения «медлительности» при наборе текста. Самый медленный метод, который я рассмотрел, был около 125 мс для 10.000 вызовов в IE8. Что составляет 0,0125 мс на удар.
Я обнаружил, что методы, опубликованные Коденепалом и Робином Мабеном, являются самыми быстрыми ~ 0,001 мс (IE8), но остерегайтесь различной семантики.
Возможно, это облегчение для тех, кто внедряет такую функциональность в свой код.
источник
Модифицированный ответ erikkallen:
источник
Это решение работало очень хорошо при тестировании.
Я добавил некоторый код для обработки некоторых полей ввода, не помеченных для ввода, и для интеграции в приложение Oracle PL / SQL, которое генерирует форму ввода для моей работы.
Мои два цента":
источник
Я создал проект NPM с чистой версией принятого в настоящее время (erikkallen)
https://github.com/slorber/backspace-disabler
Он использует в основном те же принципы, но:
источник
Вот мой переписанный ответ. Я попытался проверить element.value! == undefined (поскольку некоторые элементы наподобие могут не иметь атрибута html, но могут иметь свойство значения javascript где-то в цепочке прототипов), однако это не сработало очень хорошо и имело множество крайних случаев. Кажется, нет хорошего способа убедиться в этом на будущее, поэтому белый список кажется лучшим вариантом.
Это регистрирует элемент в конце фазы всплывающего события, поэтому, если вы хотите обрабатывать Backspace любым другим способом, вы можете сделать это в других обработчиках.
Это также проверяет экземпляр HTMLTextAreElement, поскольку теоретически можно иметь веб-компонент, который наследуется от этого.
Это не проверяет contentEditable (в сочетании с другими ответами).
https://jsfiddle.net/af2cfjc5/15/
источник
Точка сайта: отключить обратно для Javascript
event.stopPropagation()
иevent.preventDefault()
ничего не делать в IE. Я должен был отправить возвратevent.keyCode == 11
(я только что взял что-то) вместо того, чтобы просто сказать,"if not = 8, run the event"
чтобы заставить это работать, все же.event.returnValue = false
тоже работает.источник
Еще один метод с использованием jquery
источник
Я использую это в своем коде в течение некоторого времени. Я пишу онлайн-тесты для студентов и столкнулся с проблемой, когда студенты нажимали клавишу Backspace во время теста, и это возвращало их обратно к экрану входа в систему. Срыв! Это работает на FF точно.
источник