[英]Submit form data both on clicking enter and hitting the submit button
Here's a form that I have: 这是我的表格:
<form class="form-horizontal" id="login-form">
<input name="email" id="email" type="email" size="30" class="span4" placeholder="Email" style="margin-top:20px; margin-left:20px; width: 270px;"/>
<br>
<input name="passwd" id="passwd" type="password" class="span4" placeholder="Password" style="margin-top:10px; margin-left:20px; width: 270px;"/>
<br><br>
<input type="button" id="login" name="login" value="Go" class="btn btn-custom" style="width:30%; margin-left:30px; margin-top:20px"/>
<br>
<br>
</form>
Here a ajax call I make using JavaScript to submit the data on clicking the button: 这是我使用JavaScript在单击按钮时提交数据的ajax调用:
$('#login').click(function(){
$.ajax({
url:"script.php",
type:'POST',
dataType:"json",
data: $("#login-form").serialize()
}).done(function(data){
//do domething
});
});
How can I submit the data both by pressing the enter key and clicking on the submit button? 如何通过按Enter键并单击提交按钮来提交数据?
I have updated code. 我有更新的代码。 Create a function and call it on both textbox keypress event and identify submit button then call function and on click event of button.
创建一个函数并在文本框按键事件上调用它,并识别提交按钮然后调用函数和按钮的单击事件。
function submitLogin() {
$.ajax({
url:"script.php",
type:'POST',
dataType:"json",
data: $("#login-form").serialize()
}).done(function(data){
//do domething
});
}
$('#email').keypress(function(e) {
if (e.which == '13') {
submitLogin();
}
});
$('#passwd').keypress(function(e) {
if (e.which == '13') {
submitLogin();
}
});
$('#login').click(function(){
submitLogin();
});
How about to change input type to "submit" and input click event into form submit? 如何将输入类型更改为“提交”并将单击事件输入到表单提交中?
<input type="submit" id="login" name="login" value="Go" class="btn btn-custom" style="width:30%; margin-left:30px; margin-top:20px"/>
JQuery JQuery的
$('#login-form').submit(function(){
$.ajax({
url:"script.php",
type:'POST',
dataType:"json",
data: $("#login-form").serialize()
}).done(function(data){
//do domething
});
});
You should be able to add keypress function on both email and password fields. 您应该能够在电子邮件和密码字段上添加按键功能。
$('#email').keypress(function(e){
if (e.keyCode == 13) {
$('#login-form').submit(/*...*/);
}
}
I gave you example for one field. 我举了一个字段的例子。
this is the idea: 这是个主意:
$("input").keypress(function(event) {
if (event.which == 13) {
event.preventDefault();
runAjax();
// or
// runSubmit();
}
});
$('#login').click(function(){
runAjax();
//or
//runSubmit();
});
function runAjax(){
$.ajax({
url:"script.php",
type:'POST',
dataType:"json",
data: $("#login-form").serialize()
}).done(function(data){
//do domething
});
}
function runSubmit(){
$("form").submit();
}
Use On method to work on Entering and clicking 使用On方法处理输入并单击
$('#element').on('click keypress', function(event) {
var check = 1; // Default for Click
if (e.keyCode == 13) //When Enter Key is pressed
{
var check = 1;
}
else
{
var check = 0; // other keys pressed
}
if (check == 1)
{
$.ajax({
url:"script.php",
type:'POST',
dataType:"json",
data: $("#login-form").serialize()
}).done(function(data){
//do domething
});
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.