在尝试使用jQuery的submitHandler时不提交表单

我正在将联系表单转换为AJAX，以便我可以执行成功function。 现在代码停止在submitHandler部分，说它是未定义的。 我的submitHandler怎么没有定义？

submitHandler(function(form) {

我是以正确的方式做到这一点的吗？ 我想使用我当前的PHP，因为我将它构建为jQueryvalidation的后端validation。

有没有人看到submitHandler有什么问题，以及可能阻止它发送的任何内容？

HTML

 
 
 <?php if($sent === true) { echo "
Thanks, your message has been sent successfully
"; } elseif($hasError === true) { echo '
'; foreach($errorArray as $key => $val) { echo "
" . ucfirst($key) . " field error - $val
"; } echo '
'; } ?> 
 <input type="text" class="contact_input" name="name" id="name" value="" placeholder="Name"> 
 
 <input type="email" class="contact_input" name="email" id="email" value="" placeholder="Email"> 
 
  
  
 
 
 
 
THANK YOU FOR CONTACTING OUR AGENCY!
 
Your submission has been received and one of our team members will contact you shortly.
 
  

jQuery的

 //Send the project email $(document).ready(function(){ $("#submit_contact").on("click", function (event) { //event.preventDefault(); $("#contactform").validate({ rules: { name: { required: true, minlength: 2 }, email: { required: true, email: true }, message: { required: true, minlength: 5 } }, messages: { name: { required: "Please enter your name", minlength: "Your name seems a bit short, doesn't it?" }, email: { required: "Please enter your email address", email: "Please enter a valid email address" }, message: { required: "Please enter your message", minlength: "Your message seems a bit short. Please enter at least 5 characters" } } }); submitHandler(function(form) { //Variables for the form ids var name = $("#name").val(); var email = $("#email").val(); var message = $("#message").val(); $.ajax({ url: "email-contact.php", type: "POST", data: { "project_name": name, "title_roll": email, "project_email": message }, success: function (data) { //console.log(data); // data object will return the response when status code is 200 if (data == "Error!") { alert("Unable to send email!"); alert(data); } else { $(".contact-container").addClass("removeClass"); $(".contact-email-success").show(); $(".announcement_success").fadeIn(); $(".announcement_success").show(); // $('.announcement_success').html('Email Successfully sent!'); //$('.announcement_success').delay(5000).fadeOut(400); } }, error: function (xhr, textStatus, errorThrown) { alert(textStatus + "|" + errorThrown); //console.log("error"); //otherwise error if status code is other than 200. } }); }); }); }); 

PHP

 $hasError = false; $sent = false; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; if(isset($_POST['submitform'])) { $name = trim(htmlspecialchars($_POST['name'], ENT_QUOTES)); $email = trim(htmlspecialchars($_POST['email'])); $message = trim(htmlspecialchars($_POST['message'], ENT_QUOTES)); $fieldsArray = array( 'name' => $name, 'email' => $email, 'message' => $message ); $errorArray = array(); foreach($fieldsArray as $key => $val) { switch ($key) { case 'name': case 'message': if(empty($val)) { $hasError = true; $errorArray[$key] = ucfirst($key) . " field was left empty."; } break; case 'email': if(!filter_var($email, FILTER_VALIDATE_EMAIL)) { $hasError = true; $errorArray[$key] = "Invalid Email Address entered"; } else { $email = filter_var($email, FILTER_SANITIZE_EMAIL); } break; } } if($hasError !== true) { $to = "gsdfa"; $subject = "Contact Form Submitted"; $msgcontents = "Name: $name
Email: $email
Message: $message"; $headers = "MIME-Version: 1.0 \r\n"; $headers .= "Content-type: text/html; charset=iso-8859-1 \r\n"; $headers .= "From: $name  \r\n"; $emailsent = mail($to, $subject, $msgcontents,$headers); if($mailsent) { $sent = true; unset($name); unset($email); unset($message); } } } 

Answer 1

您需要在validate()函数调用中定义submitHandler 。 但你只是想在外面执行它。 这样做 –

 $("#contactform").validate({ rules: {...}, messages: {...}, submitHandler: function(form) { //Variables for the form ids var name = $("#name").val(); var email = $("#email").val(); var message = $("#message").val(); $.ajax({ url: "email-contact.php", type: "POST", data: { "project_name": name, "title_roll": email, "project_email": message }, success: function (data) { //console.log(data); // data object will return the response when status code is 200 if (data == "Error!") { alert("Unable to send email!"); alert(data); } else { $(".contact-container").addClass("removeClass"); $(".contact-email-success").show(); $(".announcement_success").fadeIn(); $(".announcement_success").show(); // $('.announcement_success').html('Email Successfully sent!'); //$('.announcement_success').delay(5000).fadeOut(400); } }, error: function (xhr, textStatus, errorThrown) { alert(textStatus + "|" + errorThrown); //console.log("error"); //otherwise error if status code is other than 200. } }); } }); 

请参阅submitHandler文档中的示例。

Answer 2

用这个：

JQuery的：

 $(document).ready(function(){ $("#submit_contact").click(function(){ event.preventDefault(); var name = $("#name").val(); var email = $("#email").val(); var message = $("#message").val(); $.ajax({ url: "email-contact.php", type: "POST", data: { "project_name": name, "title_roll": email, "project_email": message }, success: function (data) { //console.log(data); // data object will return the response when status code is 200 if (data == "Error!") { alert("Unable to send email!"); alert(data); } else { $(".contact-container").addClass("removeClass"); $(".contact-email-success").show(); $(".announcement_success").fadeIn(); $(".announcement_success").show(); // $('.announcement_success').html('Email Successfully sent!'); //$('.announcement_success').delay(5000).fadeOut(400); } }, error: function (xhr, textStatus, errorThrown) { alert(textStatus + "|" + errorThrown); //console.log("error"); //otherwise error if status code is other than 200. } }); }); }); 

并在您的PHP文件更改：

 $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; 

成

 $name = $_POST['project_name']; $email = $_POST['title_roll']; $message = $_POST['project_email']; 

希望它的帮助