输入密钥以提交Ajax表单

我有一个非常简单的AJAX表单，要求提供一个电子邮件地址，并在提交后发送给我。

如何在输入回车键时让表单提交？

这在用户单击提交按钮时运行：

 $(document).ready(function () { $("#submit_btn").click(function () { // Get input field values: var user_email = $('input[name=email]').val(); // Simple validation at client's end // We simply change border color to red if empty field using .css() var proceed = true; if (user_email === "") { $('input[name=email]').css('border-color', 'red'); proceed = false; } // Everything looks good! Proceed... if (proceed) { /* Submit form via AJAX using jQuery. */ } }); // Reset previously set border colors and hide all message on .keyup() $("#contact_form input, #contact_form textarea").keyup(function () { $("#contact_form input, #contact_form textarea").css('border-color', ''); $("#result").slideUp(); }); });  

---

我知道之前已经问过这个问题 – 我无法使keypressfunction起作用。

我试过这个无济于事：

 $("#contact_form").keypress(function (e) { if ((e.keyCode == 13) && (e.target.type != "textarea")) { e.preventDefault(); // Get input field values var user_email = $('input[name=email]').val(); // Simple validation at client's end // We simply change border color to red if empty field using .css() var proceed = true; if (user_email === "") { $('input[name=email]').css('border-color', 'red'); proceed = false; } // Everything looks good! Proceed... if (proceed) { /* Submit form via AJAX using jQuery. */ } } }); 

表格是#contact_form 。

任何帮助将不胜感激……

Answer 1

只需将提交事件绑定到您的表单，然后输入键也将起作用：

 $("#contact_form").submit(function (e) { e.preventDefault(); // Get input field values var user_email = $('input[name=email]').val(); // Simple validation at client's end // We simply change border color to red if empty field using .css() var proceed = true; if (user_email === "") { $('input[name=email]').css('border-color', 'red'); proceed = false; } if (proceed) { // Insert the AJAX here. } }); 

代码在这里： http ： //jsfiddle.net/6TSWk/6/

Answer 2

在每个fieldbox中添加新类或checkbox => class keypressbutton然后在keypress上替换你的代码，如下所示：

 $(document).on("keypress",".keypressbutton",function(event) { var keyCode = event.which || event.keyCode; if (keyCode == 13) { $("#submit_btn").click(); return false; } }); 

Answer 3

 $("#myform").keypress(function(event){ if(event.keycode===13){ // enter key has code 13 //some ajax code code here //alert("Enter key pressed"); } }); 

Answer 4

你的if语句中有两个左括号，并且错过了一个右括号。 另外，我会改变e.target.type 。 试试这个：

 $("#contact_form").keypress(function (e) { if ((e.keyCode == 13) && ($('input[name="email"]').is(':focus'))) { e.preventDefault(); //get input field values var user_email = $('input[name=email]').val(); //simple validation at client's end //we simply change border color to red if empty field using .css() var proceed = true; if (user_email === "") { $('input[name=email]').css('border-color', 'red'); proceed = false; } } }); 

Answer 5

您可以使用提交按钮，而不是使用点击function按钮。 加载validate.js文件

 function validateEmail(email) { var reg = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/ if (reg.test(email)) { return true; } else{ return false; } } $("#test-form").validate({ submitHandler: function(form) { //form.submit(); var email=$("#email").val(); if(email=='' ) { // Here you can type your own error message $('#valid').css("display","none"); $('#empty').css("display","block"); return false; } if (!(validateEmail(email))) { $('#empty').css("display","none"); $('#valid').css("display","block"); return false; } else { $.ajax({ url: "signup.php", type: form.method, data: $(form).serialize(), success: function(response) { } }); } } }); }); 

Answer 6

简单的方法是：

在HTML代码中：

 
 First Name:  
 Last Name:  
   

在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 } }); }