Отправка формы на 'Enter' с помощью jQuery?
У меня есть форма входа в болотный стандарт - текстовое поле электронной почты, поле пароля и кнопка отправки в проекте AIR с использованием HTML/jQuery. Когда я нажимаю Enter в форме, содержимое всей формы исчезает, но форма не отправляется. Кто-нибудь знает, является ли это проблемой Webkit (Adobe AIR использует Webkit для HTML), или если я набросал все это?
Я пробовал:
$('.input').keypress(function (e) {
if (e.which == 13) {
$('form#login').submit();
}
});
Но это не остановило поведение клиринга или не представило форму. Никаких действий, связанных с формой, не может быть проблемой? Могу ли я поместить функцию javascript в действие?
Ответы
Ответ 1
$('.input').keypress(function (e) {
if (e.which == 13) {
$('form#login').submit();
return false; //<---- Add this line
}
});
Ознакомьтесь с ответом stackoverflow:
event.preventDefault() против возврата false
По сути, "return false" - это то же самое, что вызов e.preventDefault
и e.stopPropagation()
.
Ответ 2
В дополнение к возврату false, как упоминал Джейсон Коэн. Возможно, вам также нужно будет предотвратитьDefault
e.preventDefault();
Ответ 3
Не знаю, поможет ли это, но вы можете попробовать имитировать кнопку отправки, вместо прямой отправки формы. У меня есть следующий код в производстве, и он отлично работает:
$('.input').keypress(function(e) {
if(e.which == 13) {
jQuery(this).blur();
jQuery('#submit').focus().click();
}
});
Примечание: jQuery ('# submit'). focus() заставляет кнопку анимировать кнопку при нажатии кнопки.
Ответ 4
Верните false
, чтобы предотвратить продолжение нажатия клавиши.
Ответ 5
Есть ли какая-либо причина, по которой вам нужно перехватывать и проверять ключ ввода?
Не могли бы вы просто добавить
<input type="submit" />
в вашу форму и, естественно, она будет отправлена при нажатии кнопки ввода? Вы могли бы даже прикрепить форму onsubmit
и вызвать функцию проверки оттуда, если хотите...
Вы даже можете использовать onsubmit
как тест, чтобы узнать, отправляется ли ваша форма, но она не будет работать, если вы вызываете form.submit()
.
Ответ 6
Здесь вы можете сделать это как плагин JQuery (если вы хотите повторно использовать функциональность):
$.fn.onEnterKey =
function( closure ) {
$(this).keypress(
function( event ) {
var code = event.keyCode ? event.keyCode : event.which;
if (code == 13) {
closure();
return false;
}
} );
}
Теперь, если вы хотите украсить этот тип функциональности, он прост как это:
$('#your-input-id').onEnterKey(
function() {
// Do stuff here
} );
Ответ 7
Вы также можете просто добавить onsubmit="return false"
в код формы на странице, чтобы предотвратить поведение по умолчанию.
Затем переместите (.bind
или .live
) событие формы submit
в любую функцию с jQuery в файле javascript.
Вот пример кода, который поможет:
HTML
<form id="search_form" onsubmit="return false">
<input type="text" id="search_field"/>
<input type="button" id="search_btn" value="SEARCH"/>
</form>
Javascript + jQuery
$(document).ready(function() {
$('#search_form').live("submit", function() {
any_function()
});
});
Работает с 2011-04-13, с Firefox 4.0 и jQuery 1.4.3
Ответ 8
Это мой код:
$("#txtMessage").on( "keypress", function(event) {
if (event.which == 13 && !event.shiftKey) {
event.preventDefault();
$("#frSendMessage").submit();
}
});
Ответ 9
Также, чтобы сохранить доступность, вы должны использовать это, чтобы определить свой код ключа:
c = e.which ? e.which : e.keyCode;
if (c == 13) ...
Ответ 10
Просто добавление для простой реализации. Вы можете просто создать форму, а затем сделать кнопку отправки скрытой:
Например:
<form action="submit.php" method="post">
Name : <input type="text" name="test">
<input type="submit" style="display: none;">
</form>
Ответ 11
Теперь я использую
$("form").submit(function(event)
Сначала я добавил обработчик событий к кнопке submit, которая вызвала ошибку.
Ответ 12
В HTML-кодах:
<form action="POST" onsubmit="ajax_submit();return false;">
<b>First Name:</b> <input type="text" name="firstname" id="firstname">
<br>
<b>Last Name:</b> <input type="text" name="lastname" id="lastname">
<br>
<input type="submit" name="send" onclick="ajax_submit();">
</form>
В Js-кодах:
function ajax_submit()
{
$.ajax({
url: "submit.php",
type: "POST",
data: {
firstname: $("#firstname").val(),
lastname: $("#lastname").val()
},
dataType: "JSON",
success: function (jsonStr) {
// another codes when result is success
}
});
}
Ответ 13
Сегодня я обнаружил, что при нажатии клавиши Enter событие keypress не срабатывает, поэтому вы можете вместо этого переключиться на keydown() или keyup().
Мой тестовый скрипт:
$('.module input').keydown(function (e) {
var keyCode = e.which;
console.log("keydown ("+keyCode+")")
if (keyCode == 13) {
console.log("enter");
return false;
}
});
$('.module input').keyup(function (e) {
var keyCode = e.which;
console.log("keyup ("+keyCode+")")
if (keyCode == 13) {
console.log("enter");
return false;
}
});
$('.module input').keypress(function (e) {
var keyCode = e.which;
console.log("keypress ("+keyCode+")");
if (keyCode == 13) {
console.log("Enter");
return false;
}
});
Вывод в консоль при вводе "A Enter B" на клавиатуре:
keydown (65)
keypress (97)
keyup (65)
keydown (13)
enter
keyup (13)
enter
keydown (66)
keypress (98)
keyup (66)
Во второй последовательности вы видите, что "нажатие клавиши" отсутствует, но нажатие/отпускание клавиши зарегистрировано и код регистрационной клавиши "13".
Согласно документации по jQuery для функции keypress():
Note: as the keypress event isn't covered by any official specification, the actual behavior encountered when using it may differ across browsers, browser versions, and platforms.
Протестировано на IE11 и FF61 на Server 2012 R2
Ответ 14
Попробуйте это:
var form = document.formname;
if($(form).length > 0)
{
$(form).keypress(function (e){
code = e.keyCode ? e.keyCode : e.which;
if(code.toString() == 13)
{
formsubmit();
}
})
}