我正在努力让我的邮件表单正常工作,但我在调用ajax成功函数时一直遇到问题。我读过很多与我所说的很接近的技巧和问题,但还没有找到答案,所以请不要再回复我另一篇文章,也不要说这是一个重复的问题。我得到一个readyState为4,状态为200加上一个statusText为"OK",成功函数仍然没有被调用。我不知道是什么阻止了它被调用。电子邮件信息被发送到我的电子邮件非常好,但成功功能再次没有被调用。任何帮助都将是惊人的,并非常感谢。
这是我的EMAIL.php文件:
<?php
error_reporting(E_ALL|E_STRICT);
ini_set('display_errors', 1);
# Is the OS Windows or Mac or Linux
if (strtoupper(substr(PHP_OS,0,3)=='WIN')) {
$eol="'r'n";
} elseif (strtoupper(substr(PHP_OS,0,3)=='MAC')) {
$eol="'r";
} else {
$eol="'n";
}
//CHECK IF MAIL HAS BEEN SENT AND IF EMAIL FIELD IS FILLED.
if(isset($_POST['email'])) {
$email_to = 'me@example.com';
$email_subject = 'Website Change Request';
if(!isset($_POST['name']) ||
!isset($_POST['email']) ||
!isset($_POST['message'])) {
died('We are sorry, but there appears to be a problem with the form you submitted.');
}
// Get the form fields and remove whitespace.
$em_name = $_POST["name"];
$em_email = $_POST["email"];
$em_message = $_POST["message"];
$em_phone = $_POST['phone'];
$em_website = $_POST['website'];
$em_hear = $_POST['hear'];
$em_startdate = $_POST['startdate'];
$em_budget = $_POST['budget'];
$error_message = "";
$string_exp = "/^[A-Za-z .'-]+$/";
$email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+'.[A-Za-z]{2,4}$/';
if(!preg_match($email_exp,$em_email)) {
$error_message .= 'The Email Address you entered does not appear to be valid.<br />';
}
if(!preg_match($string_exp,$em_name)) {
$error_message .= 'The First Name you entered does not appear to be valid.<br />';
}
if(strlen($em_message) < 2) {
$error_message .= 'The Comments you entered do not appear to be valid.<br />';
}
if(strlen($error_message) > 0) {
echo $error_message;
}
$mime_boundary = md5(time());
$email_headers = "From: " . $em_email . $eol;
$email_headers .= "Reply-To: " . $em_email . $eol;
$email_headers .= "X-Mailer: PHP v".phpversion().$eol;
$email_message .= "Content-Type: text/html; charset=iso-8859-1".$eol;
$email_message .= "Content-Transfer-Encoding: 8bit".$eol.$eol;
// Build the email content.
$email_message = "Name: " . $em_name . $eol;
$email_message .= "Message: " . $em_message . $eol;
$email_message .= "Budget: " . $em_budget . $eol;
$email_message .= "Start Date: " . $em_startdate . $eol;
$email_message .= "How did you hear about us?: " . $em_hear . $eol;
$email_message .= "Email: " . $em_email . $eol;
$email_message .= "Phone: " . $em_phone . $eol;
$email_message .= "Website: " . $em_website . $eol;
mail($email_to, $email_subject, $email_message, $email_headers);
echo "MAIL INFO: "+mail($email_to, $email_subject, $email_message, $email_headers);
echo "message was succesfull!";
}
else{
echo "not working form";
}
?>
Javascript:
emailValidation: function(e){
e.preventDefault();
$('body, html').animate({scrollTop:0},"slow");
var valid = '';
var name = $("#f_name").val();
var email = $("#f_email").val();
var message = $("#f_message").val();
var emailReg = /^(['w-'.]+@(['w-]+'.)+['w-]{2,4})?$/;
if(name === '' || name.length <= 2){
valid += '<p class="error">Name must be longer than 2 char.</p>';
}
if(message === '' || message.length <= 5){
valid += '<p class="error">Message must be longer than 5 char.</p>';
}
if (!(email).match(emailReg)){
valid += '<p class="error">Invalid Email</p>';
}
if (valid !== ''){
$('#form-messages').html(''+valid+'').fadeIn();
}
else {
// var formData = $("#contact").serialize();//Value for sanitized form values to be paased to email.php. Value returns an array
portfolio.submitEmail();
}
},
submitEmail: function(){
var formData = $("#contact").serializeArray();
console.log('Form DATA: '+formData);//Value for sanitized form values to be paased to email.php. Value returns an array
//$('#form-messages').html("Proccessing...").fadeIn('slow');
$.ajax({
type: 'POST',
url: 'mailer.php',
data: formData,
dataType: 'json',
success: function(response){
$("#contact").fadeOut('slow').remove();
$('#form-messages').removeClass();
$('#form-messages').empty().addClass('success');
$('#form-messages').html('<p class="success">Message has been sent succesfully! Thank you '+ $('#f_name').val() +', a response will be returned in less than one business day.</p>');
console.log('success');
console.log(response);
},
complete: function(response){
$("#contact").fadeOut('slow').remove();
$('#form-messages').removeClass();
$('#form-messages').empty().addClass('success');
$('#form-messages').html('<p class="success">Message has been sent succesfully! Thank you '+ $('#f_name').val() +', a response will be returned in less than one business day.</p>');
console.log('complete');
console.log(response);
},
error: function(error){
console.log('error');
console.log(error);
},
});
},
问题似乎出现在jQuery.ajax
设置对象中。您正在指定'json'
的dataType
,但您的EMAIL.php
不输出JSON,它从外观上输出纯文本。由于jQuery无法将响应解析为JSON,它将调用error
回调,而不是success
回调。
若要更正此问题,请改为指定dataType: "text"
,或者完全删除该属性。
示例:
$.ajax({
type: 'POST',
url: 'mailer.php',
data: formData,
dataType: 'text',
success: function(response){
$("#contact").fadeOut('slow').remove();
$('#form-messages').removeClass();
$('#form-messages').empty().addClass('success');
$('#form-messages').html('<p class="success">Message has been sent succesfully! Thank you '+ $('#f_name').val() +', a response will be returned in less than one business day.</p>');
console.log('success');
console.log(response);
},
complete: function(response){
$("#contact").fadeOut('slow').remove();
$('#form-messages').removeClass();
$('#form-messages').empty().addClass('success');
$('#form-messages').html('<p class="success">Message has been sent succesfully! Thank you '+ $('#f_name').val() +', a response will be returned in less than one business day.</p>');
console.log('complete');
console.log(response);
},
error: function(error){
console.log('error');
console.log(error);
},
});
此外,为了避免PHP的严格警告,请更改此行:
$email_message .= "Content-Type: text/html; charset=iso-8859-1".$eol;
对此:
$email_message = "Content-Type: text/html; charset=iso-8859-1".$eol;
在追加之前从未声明过此变量,这将导致一个严格的警告。