[英]Why does this form submit?
我有一個問題,我想通過AJAX郵寄,我的問題是我的表格不斷提交。 由於某種原因,它會將所有表單刷新到URL中,但是我沒有使用GET發送任何內容?
HTML:
<form onsubmit="ajaxEmail();
return false;" >
<input type="text" name="name" id="name" value="Name" maxlength="1000" onfocus="this.value = this.value == 'Name' ? '' : this.value;" onblur="this.value = this.value == '' ? 'Name' : this.value;" />
<input type="email" name="email" id="email" value="Email" maxlength="1000" onfocus="this.value = this.value == 'Email' ? '' : this.value;" onblur="this.value = this.value == '' ? 'Email' : this.value;" />
<input type="text" id="subject" value="Subject" maxlength="2000" onfocus="this.value = this.value == 'Subject' ? '' : this.value;" onblur="this.value = this.value == '' ? 'Subject' : this.value;" />
<textarea name="Message" id="body" maxlength="40000" onfocus="this.value = this.value == 'Message' ? '' : this.value;" onblur="this.value = this.value == '' ? 'Message' : this.value;">Message</textarea>
<input type="submit" value="send" class="submit-button"/>
</form>
JS:
$(function ajaxEmail() {
$('#emailMsgResp').hide();
$('#emailMsgBody').hide();
var name = $('#name').val();
var emailForm = $('#email').val();
var subject = $('#subject').val();
var message = $('#body').val();
$.ajax({
type: "POST", // Can be "GET"
url: "../ajaxMail.php",
data: {
name: name,
emailFrom: emailFrom,
subject: subject,
message: message
},
dataType: "json",
success: function (data) {
if (data['response'] == 1) {
$('#emailMsgResp').show();
$('#emailMsgResp').append('<div class="skill3" id="emailMsgBody" style="width:325px; height: 38px; margin: 0px auto;"><p>Thank you for contacting me' + data['response'] + '</p></div>');
return false;
} else if (data['response'] == 0) {
$('#emailMsgResp').show();
$('#emailMsgResp').append('<div class="skill3" id="emailMsgBody" style="width:325px; height: 38px; margin: 0px auto;"><p>Error: Please use your own client and write to contact@ivan-ristic.com</p></div>');
return false;
}
}
});
return false;
});
ajaxMail.php
$email_it_to = 'mymail@mymail.com';
$name = $_POST['name'];
$email_from = $_POST['emailFrom'];
$subject = $_POST['subject'];
$body = $_POST['message'];
if(!isset($name) || !isset($email_from) || !isset($subject) || !isset($body)) {
$response = 0;
} else {
$email_from = $email;
$email_subject = "Contact Form: ".stripslashes($subject);
$email_message = "Below is a message submitted by '".stripslashes($name);
$email_message .="' on ".date("d/m/Y")." at ".date("H:i")."\n\n";
$email_message .= stripslashes($body);
$headers = 'From: '.$email_from."\r\n" .
'Reply-To: '.$email_from."\r\n" .
'X-Mailer: PHP/' . phpversion();
if (mail($email_it_to, $email_subject, $email_message, $headers)) {
$response = 1;
} else {
$response = 0;
}
}
echo json_encode($response);
您正在將函數分配為文檔就緒處理程序,因此頁面就緒后就會立即調用它。 你有:
$(function ajaxEmail() {
/* your code */
});
...相當於:
$(document).ready(function ajaxEmail() {
/* your code */
});
您應該擁有什么:
function ajaxEmail() {
/* your code */
}
這將使您的函數成為可以從內聯事件屬性調用的全局函數。
或者,由於無論如何都在使用jQuery,請從表單中刪除內聯onsubmit=...
處理程序,然后使用jQuery進行分配:
$(function() {
$("form").submit(function(e) {
e.preventDefault();
/* your other function contents here */
});
});
當然,最好給您的表單一個id屬性並使用$("#yourFormId").submit(...)
而不是使用$("form").submit(...)
(分配相同的值)處理頁面上的所有表單)。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.