У меня на моей странице есть javascript, который, похоже, не работает.
$('form').bind("keypress", function(e) {
if (e.keyCode == 13) {
e.preventDefault();
return false;
}
});
Я бы хотел отключить отправку формы при вводе или, еще лучше, для вызова моей формы ajax. Любое решение приемлемо, но код, который я включаю выше, не препятствует отправке формы.
Если keyCode не пойман, поймайте which:
$('#formid').on('keyup keypress', function(e) {
var keyCode = e.keyCode || e.which;
if (keyCode === 13) {
e.preventDefault();
return false;
}
});
EDIT: пропустил его, лучше использовать keyup вместо keypress
РЕДАКТИРОВАТЬ 2: Как и в некоторых новых версиях Firefox, представление формы не предотвращается, но безопаснее добавлять событие keypress в форму. Также он не работает (больше?), Просто привязывая событие к форме "имя", но только к идентификатору формы. Поэтому я сделал это более очевидным, изменив пример кода соответствующим образом.
ИЗМЕНИТЬ 3: Изменено bind() до on()
Обычно форма отображается на Enter, когда вы фокусируетесь на элементах ввода.
Мы можем отключить ключ Enter (код 13) на входных элементах в форме:
$('form input').on('keypress', function(e) {
return e.which !== 13;
});
Еще короче:
$('myform').submit(function() {
return false;
});
$('form').keyup(function(e) {
return e.which !== 13
});
Свойство event.which нормализует event.keyCode и event.charCode. Рекомендуется следить за событием. Для ввода клавиатуры.
$(document).on('keyup keypress', 'form input[type="text"]', function(e) {
if(e.which == 13) {
e.preventDefault();
return false;
}
});
Это решение работает во всех формах на веб-сайте (также в формах, вставленных с помощью ajax), предотвращая только входящие тексты ввода. Поместите его в функцию готовности документа и забудьте об этой проблеме на всю жизнь.
Из-за чрезмерного количества ошибок при захвате и проверке каждого нажатия клавиши ВВОД меня вызывает ошибка, поэтому мое решение зависит от поведения браузера:
Нажатие ENTER приведет к событию клика на кнопке отправки (проверено в IE11, Chrome 38, FF 31) ** (ref: http://mattsnider.com/how-forms-submit-when-pressing-enter/)
Итак, мое решение состоит в том, чтобы удалить стандартную кнопку отправки (т.е. <input type="submit">), чтобы вышеуказанное поведение терпит неудачу, потому что нет кнопки отправки для магического нажатия при нажатии ENTER. Вместо этого я использую обработчик jQuery click на обычной кнопке, чтобы отправить форму через метод jQuery .submit().
<form id="myform" method="post">
<input name="fav_color" type="text">
<input name="fav_color_2" type="text">
<button type="button" id="form-button-submit">DO IT!</button>
</form>
<script>
$('#form-button-submit').click(function(){
$('#myform').submit();
});
</script>
Демо: http://codepen.io/anon/pen/fxeyv?editors=101
** это поведение неприменимо, если форма имеет только одно поле ввода и это поле является "текстовым" входом; в этом случае форма будет отправляться по клавише ENTER, даже если в HTML-разметке отсутствует кнопка отправки (например, поле поиска). Это стандартное поведение браузера с 90-х годов.
Большинство приведенных выше ответов не позволят пользователям добавлять новые строки в поле textarea. Если это то, чего вы хотите избежать, вы можете исключить этот конкретный случай, проверив, какой элемент в данный момент имеет фокус:
var keyCode = e.keyCode || e.which;
if (keyCode === 13 && !$(document.activeElement).is('textarea')) {
e.preventDefault();
return false;
}
если вы просто хотите отключить отправку на кнопку ввода и отправки, также используйте форму onsubmit event
<form onsubmit="return false;">
Вы можете заменить "return false" на вызов функции JS, которая будет делать все необходимое, а также отправить форму в качестве последнего шага.
Вы можете сделать это отлично в чистом Javascript, просто и без библиотеки. Вот мой подробный ответ на аналогичную тему: Отключить ключ ввода для формы
Короче говоря, вот код:
<script type="text/javascript">
window.addEventListener('keydown',function(e){if(e.keyIdentifier=='U+000A'||e.keyIdentifier=='Enter'||e.keyCode==13){if(e.target.nodeName=='INPUT'&&e.target.type=='text'){e.preventDefault();return false;}}},true);
</script>
Этот код предназначен для предотвращения использования ключа "Enter" для типа ввода = "текст". (Поскольку посетителю, возможно, потребуется нажать Enter на странице). Если вы хотите отключить "Enter" для других действий, вы можете добавить console.log(e); для ваших целей тестирования и нажмите F12 в хроме, перейдите на вкладку "console" и нажмите "backspace" на странице и загляните внутрь, чтобы увидеть, какие значения будут возвращены, затем вы можете настроить таргетинг на все эти параметры для дальнейшего улучшения кода выше, чтобы удовлетворить ваши потребности в "e.target.nodeName" , "e.target.type" и многом другом...
Я не знаю, решите ли вы эту проблему или кто-то, кто пытается решить это сейчас, но вот мое решение для этого!
$j(':input:not(textarea)').keydown(function(event){
var kc = event.witch || event.keyCode;
if(kc == 13){
event.preventDefault();
$j(this).closest('form').attr('data-oldaction', function(){
return $(this).attr('action');
}).attr('action', 'javascript:;');
alert('some_text_if_you_want');
$j(this).closest('form').attr('action', function(){
return $(this).attr('data-oldaction');
});
return false;
}
});
Следующий код будет отрицать, что ключ ввода используется для отправки формы, но все равно позволит вам использовать клавишу ввода в текстовом поле. Вы можете отредактировать его дальше в зависимости от ваших потребностей.
<script type="text/javascript">
function stopRKey(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if ((evt.keyCode == 13) && ((node.type=="text") || (node.type=="radio") || (node.type=="checkbox")) ) {return false;}
}
document.onkeypress = stopRKey;
</script>
В firefox, когда вы на входе и нажмите enter, он представит его в верхней форме. Решение находится в форме заявки на добавление:
<input type="submit" onclick="return false;" style="display:none" />
3 года спустя, и ни один человек не ответил на этот вопрос полностью.
Ответчик хочет отменить отправку формы по умолчанию и вызвать собственный Ajax. Это простой запрос с простым решением. Нет необходимости перехватывать каждый символ, вводимый в каждый вход.
Предполагая, что форма имеет кнопку отправки, будь то <button id="save-form"> или <input id="save-form" type="submit">, выполните:
$("#save-form").on("click", function () {
$.ajax({
...
});
return false;
});
Простой способ - изменить тип кнопки на кнопку - в html, а затем добавить событие в js...
Изменить от этого:
<form id="myForm">
<button type="submit">Submit</button>
</form>
Для
<form id="myForm">
<button type="button" id="btnSubmit">Submit</button>
</form>
А в JS или JQuery добавить:
("#btnSubmit").click(function () {
$('#myForm').submit();
});
Когда файл закончен (загрузка завершена), script обнаруживает каждое событие для клавиши "Enter", и он отключает событие позади.
<script>
$(document).ready(function () {
$(window).keydown(function(event){
if(event.keyCode == 13) {
e.preventDefault(); // Disable the " Entry " key
return false;
}
});
});
</script>
Код выше и большинство решений являются идеальными. Тем не менее, я думаю, что наиболее понравился один "короткий ответ", который является неполным.
Итак, вот весь ответ. в JavaScript с встроенной поддержкой IE 7.
var form = document.getElementById("testForm");
form.addEventListener("submit",function(e){e.preventDefault(); return false;});
Это решение теперь запретит пользователю отправлять данные с помощью ключа ввода и не перезагружает страницу или не вернет вас в начало страницы, если ваша форма находится где-то внизу.
Как насчет этого:
$(":submit").closest("form").submit(function(){
$(':submit').attr('disabled', 'disabled');
});
Это должно отключить все формы с кнопками отправки в вашем приложении.