这是我的联系方式。我用ajax post发送数据。以下是代码 的 HTML：
<div class="col-lg-7 well">
<h4 style="padding-top:8px;">Your email address will not be published. Required fields are marked <font color="red">*</font></h4>
<label>Name<font color="red">*</font></label><br>
<input class="form-control" style="height:35px;width:230px;border-radius:4px;" required type="text" name="name" id="name"/><br>
<label>Phone<font color="red">*</font></label><br>
<span>
<input id="element_4_1" name="element_4_1" class="element text" size="3" maxlength="3" value="" type="text"> -
</span>
<span>
<input id="element_4_2" name="element_4_2" class="element text" size="4" maxlength="4" value="" type="text"> -
</span>
<span>
<input id="element_4_3" name="element_4_3" class="element text" size="10" maxlength="10" value="" type="text" required >
</span>
<br><br>
<label>Email<font color="red">*</font></label><br>
<input id="email" class="form-control" style="height:35px;width:230px;border-radius:4px;" required type="email" name="text"/><br>
<label for="input4">Message</label>
<textarea name="contact_message" class="form-control" rows="4" id="input4"></textarea>
<p> </p>
<button type="submit" style="margin-left:65px;"class="btn btn-large btn-info" id="button">Submit</button>
</div>
Jquery Ajax：
<script>
$(document).ready(function(){
console.log( "ready!" );
$("#button").click(function(){
console.log("ready2");
$.ajax({
url: './contact.php',
type: "POST",
data: {
"name": $("#name").val(),
"element_4_1": $("#element_4_1").val(),
"element_4_2": $("#element_4_2").val(),
"element_4_3": $("#element_4_3").val(),
"email": $("#email").val(),
"input4": $("#input4").val(),
},
success: function(data){
$("#stage").text("Thank you for contacting us. We will get back to you shortly.");
}
});
});
});
</script>
contact.php
<?php
ini_set('display_errors','On');
error_reporting(E_ALL);
$name=$_POST['name'];
$phone=chop($_POST['element_4_1']);
$phone.=chop($_POST['element_4_2']);
$phone.=chop($_POST['element_4_3']);
$email=chop($_POST['email']);
$message1=chop($_POST['input4']);
if ($name && $phone && $email) {
$headers = "MIME-Version: 1.0\r\n";
$headers .= "Content-type: text/plain; charset=iso-8859-1\r\n";
$headers .= "From: sales@test.com \n";
$recipient= "test@test.in";
$subject="Online Enquiry ";
$message.="\nName : $name\n";
$message.="\nPhone : $phone\n";
$message.="\nEmail ID : $email\n";
$message.="\nMessage : $message1\n";
//send auto-reply
$subject_reply="Thank you for contacting";
$message_reply="Thank you for contacting us. We will get back to you shortly.";
mail($email, $subject_reply, $message_reply, $headers);
if(mail($recipient, $subject, $message, $headers)) {
echo "Thank you for contacting us. We will get back to you shortly.";
}
}
?>
现在我的问题是：
1. HTML表单中的必需属性不起作用。即使字段为空，它也不会显示任何消息
2.当从联系人.php发送邮件时，如何在主页面中显示成功消息。现在，当我点击提交时，我收到消息“谢谢”，但我只是在将邮件发送给收件人之后才想要它。
我怎么能这样做。
答案 0 :(得分：0)
1：你确定吗？您使用的浏览器是什么？
2： JS修改：
<script>
$(document).ready(function(){
console.log( "ready!" );
$("#button").click(function(){
console.log("ready2");
$.ajax({
url: './contact.php',
type: "POST",
data: {
"name": $("#name").val(),
"element_4_1": $("#element_4_1").val(),
"element_4_2": $("#element_4_2").val(),
"element_4_3": $("#element_4_3").val(),
"email": $("#email").val(),
"input4": $("#input4").val(),
},
success: function(data){
$("#stage").text(data);
}
});
});
});
</script>
PHP修改：
<?php
ini_set('display_errors','On');
error_reporting(E_ALL);
$name=$_POST['name'];
$phone=chop($_POST['element_4_1']);
$phone.=chop($_POST['element_4_2']);
$phone.=chop($_POST['element_4_3']);
$email=chop($_POST['email']);
$message1=chop($_POST['input4']);
if ($name && $phone && $email) {
$headers = "MIME-Version: 1.0\r\n";
$headers .= "Content-type: text/plain; charset=iso-8859-1\r\n";
$headers .= "From: sales@test.com \n";
$recipient= "test@test.in";
$subject="Online Enquiry ";
$message.="\nName : $name\n";
$message.="\nPhone : $phone\n";
$message.="\nEmail ID : $email\n";
$message.="\nMessage : $message1\n";
//send auto-reply
$subject_reply="Thank you for contacting";
$message_reply="Thank you for contacting us. We will get back to you shortly.";
mail($email, $subject_reply, $message_reply, $headers);
if(mail($recipient, $subject, $message, $headers)) {
echo "Thank you for contacting us. We will get back to you shortly.";
} else echo "There was an error. Please try again.";
}
?>
答案 1 :(得分：0)
这里有很多要解决的问题。首先，我们将从您的HTML问题开始，因为它们将有助于更轻松地解决您的几个问题。
缺少<form>代码。您尚未将表单包装在表单标记中 - 执行此操作！理想情况下，您还应该以不使用JS的方式制作表单，但这是一个与此分开的问题，因此我们暂时不会这样做。
<form class="contact-form">
// REST OF HTML HERE
</form>
缺少验证。您已经放置了必需的属性，该属性会通知您的代码该字段应该填写，但您实际上并未对此进行过任何测试。您可以编写一个简单的验证函数，如下所示：
function validate($form) {
$form.find('[required]').each(function() {
if ($(this).val() == '') {
return false;
}
}
return true;
}
然后您可以使用此调用调用该函数：
if (validate($(".contact-form"))) {
// Do your AJAX stuff
} else {
// Inform the user that they have missed a field
}
编辑：对于记录，您还应该执行相同的验证服务器端。我刚刚采用这种方法作为验证和围绕所述验证的最佳实践是一个很大的主题，你应该只是Google可以获得更具体的信息。
缺少状态响应。您的PHP不会向您的JS代码返回任何类型的指示，告知您的电子邮件发生了什么，让您无法处理任何错误。这很容易添加：
if(mail($recipient, $subject, $message, $headers)) {
echo '{"status":"OK","message":"Thank you for contacting us. We will get back to you shortly."}';
} else {
echo '{"status":"Error","message":"Email was not sent - an error occurred."}';
}
您可以根据自己的喜好对此进行扩展，我只是在这里给您一个最基本的工作示例。然后，您将在jQuery的回调中判断进程的成功或失败。
success: function(data){
if (data.status == "OK") {
$("#stage").text(data.message);
} else {
// Something bad happened, inform the user
}
}