我有一个挂在第三个字段上的表单,这意味着如果留空(网站),第三个字段不会触发任何验证。因为我无法通过这个,我不确定该表格是否会发送电子邮件(所以我可能有两个问题)。任何帮助将非常感谢。
更新
验证问题已由Asfer解决,任何提供不发送电子邮件的形式的帮助都会很棒,提前感谢。
更新
HTML (contact.html
)
<style>
#send_message {
width:200px !important;
font-variant: small-caps;
border:none;
cursor:pointer;
background:#3399FF;
color:#FFFFFF;
}
.error {
display: none;
width: 200px;
border: solid 1px;
padding:5px;
margin:0 0 5px 0;
color: #D8000C;
font-size:12px;
background-color: #FFBABA;
}
.success {
display: none;
width: 200px;
border: solid 1px;
padding:5px;
color: #044406;
font-size:12px;
background-color: #B7FBB9;
}
</style>
<form class="form-horizontal" name="contactForm" id='contact_form' method="post" action='email.php'>
<!-- Name -->
<div class="control-group">
<label class="control-label" for="name">Full Name</label>
<div class="controls">
<div id='name_error' class='error'>Please enter your full name</div>
<input type="text" class="input-medium" id="name">
</div>
</div>
<!-- Email -->
<div class="control-group">
<label class="control-label" for="email">Email</label>
<div class="controls">
<div id='email_error' class='error'>Please enter a valid email address</div>
<input type="text" class="input-medium" id="email">
</div>
</div>
<!-- Website -->
<div class="control-group">
<label class="control-label" for="website">Website</label>
<div class="controls">
<div id='website_error' class='error'>Please enter your website address</div>
<input type="text" class="input-medium" id="website">
</div>
</div>
<!-- Message -->
<div class="control-group">
<label class="control-label" for="message">Enquiry</label>
<div class="controls">
<div id='message_error' class='error'>Please enter your message</div>
<textarea class="input-medium" id="message" rows="6"></textarea>
</div>
</div>
<!-- Buttons -->
<div class="form-actions">
<!-- Buttons -->
<div id='mail_success' class='success'>Your message has been sent successfully</div>
<div id='mail_fail' class='error'>Sorry, an error has occurred</div>
<button id='send_message' type="submit" class="btn">Submit</button>
</div>
</form>
确认(validation.js
)
$(document).ready(function(){
$('#send_message').click(function(e){
//Stop form submission & check the validation
e.preventDefault();
// Variable declaration
var error = false;
var name = $('#name').val();
var email = $('#email').val();
var website = $('#website').val();
var message = $('#message').val();
// Form field validation
if(name.length == 0){
var error = true;
$('#name_error').fadeIn(500);
}else{
$('#name_error').fadeOut(500);
}
if(email.length == 0 || email.indexOf('@') == '-1'){
var error = true;
$('#email_error').fadeIn(500);
}else{
$('#email_error').fadeOut(500);
}
if(subject.length == 0){
var error = true;
$('#website_error').fadeIn(500);
}else{
$('#website_error').fadeOut(500);
}
if(message.length == 0){
var error = true;
$('#message_error').fadeIn(500);
}else{
$('#message_error').fadeOut(500);
}
// If there is no validation error, next to process the mail function
if(error == false){
// Disable submit button just after the form processed 1st time successfully.
$('#send_message').attr({'disabled' : 'true', 'value' : 'Sending...' });
/* Post Ajax function of jQuery to get all the data from the submission of the form as soon as the form sends the values to email.php*/
$.post("email.php", $("#contact_form").serialize(),function(result){
//Check the result set from email.php file.
if(result == 'sent'){
//If the email is sent successfully, remove the submit button
$('#submit').remove();
//Display the success message
$('#mail_success').fadeIn(500);
}else{
//Display the error message
$('#mail_fail').fadeIn(500);
// Enable the submit button again
$('#send_message').removeAttr('disabled').attr('value', 'Send The Message');
}
});
}
});
});
发送邮件(email.php
)
<?php
$to = 'support@example.com'; // Send to
$subject = 'example.com Contact Form'; // Subject of your email
$message .= 'Name: ' . $_REQUEST['name'] . "<br>";
$message .= 'Website: ' . $_REQUEST['website'] . "<br>";
$message .= 'Message: ' $_REQUEST['message'];
$headers .= "From: " . $_REQUEST['email'] . "\r\n"; // Sender's E-mail
if (@mail($to, $subject, $message, $headers))
{
// Transfer the value 'sent' to ajax function for showing success message.
echo 'sent';
}
else
{
// Transfer the value 'failed' to ajax function for showing error message.
echo 'failed';
}
?>
答案 0 :(得分:2)
检查这些行
var website = $('#website').val();
if(subject.length == 0){
我认为主题应该是网站
答案 1 :(得分:0)
如果(subject.length == 0){
,则会出现错误按网站替换主题,如if(website.length == 0){
if(name.length == 0){
var error = true;
$('#name_error').fadeIn(500);
}else{
$('#name_error').fadeOut(500);
}
if(email.length == 0 || email.indexOf('@') == '-1'){
var error = true;
$('#email_error').fadeIn(500);
}else{
$('#email_error').fadeOut(500);
}
if(subject.length == 0){ //remove this line
if(website.length == 0){ //add this line
var error = true;
$('#website_error').fadeIn(500);
}else{
$('#website_error').fadeOut(500);
}
if(subject.length == 0){
var error = true;
$('#website_error').fadeIn(500);
}else{
$('#website_error').fadeOut(500);
}
if(message.length == 0){
var error = true;
$('#message_error').fadeIn(500);
}else{
$('#message_error').fadeOut(500);
}
答案 2 :(得分:0)
一些事情:
1)在email.php中
$message .= 'Message: ' $_REQUEST['message'];
应该是
$message .= 'Message: ' . $_REQUEST['message'];
2)删除email.php中第一个分配行的。= ,以避免不必要的通知。 即:
$message = 'Name: ' . $_REQUEST['name'] . "<br>";
和
$headers = "From: " . $_REQUEST['email'] . "\r\n"; // Sender's E-mail
3)如果要发送HTML电子邮件,则需要添加一些额外的标题。请参阅mail中的示例#4。
4)除此之外,请为所有表单字段指定名称属性。
<input type="text" class="input-medium" id="name" name="name">
<input type="text" class="input-medium" id="email" name="email">
<input type="text" class="input-medium" id="website" name="website">
<textarea class="input-medium" id="message" rows="6" name="message"></textarea>
5)如果您尝试在运行Windows操作系统的计算机上发送此文件,则可能无法运行任何邮件服务器。这将导致mail()函数失败。