这看起来很简单，但我无法弄清楚。我正在使用jquery validate plugin.I验证所有文件，但我想要的是在输入文本行中显示验证消息警报，（对于电子邮件输入中的exapmle-“请填写电子邮件地址”，但现在它出现在所有领域。
在我的HTML中：
<form method="post" action="#" class="xone-contact">
<div class="row">
<div class="col-sm-12">
<div class=" margin-b-20">
<input type="text" name="name" class="form-control" placeholder="Full Name...." />
</div>
<div class=" margin-b-20">
<input type="text" name="email" class="form-control" placeholder="Email Address...." />
</div>
<div class=" margin-b-20">
<input type="text" name="phone" class="form-control" placeholder="Phone Number..." />
</div>
</div>
<div class="col-sm-12">
<textarea name="message" class="form-control margin-b-20" rows="5" placeholder="Message...."></textarea>
<div class="row">
<div class="col-sm-12 text-center">
<div class="data-status"></div>
</div>
</div>
</div>
</div>
</form>
在PHP中：
if (isset($_POST['action'])) { // Checking for submit form
$my_email = 'wow123@gmail.com'; // Change with your email address
if ($_POST['action'] == 'add') {
$name = trim(strip_tags(addslashes($_POST['name'])));
$email = trim(strip_tags(addslashes($_POST['email'])));
$message = trim(strip_tags(addslashes($_POST['message'])));
$phone = trim(strip_tags(addslashes($_POST['phone'])));
$pattern_name = '/^[a-zA-Z]{2}/';
$pattern_email = '/^[^\W][a-zA-Z0-9_]+(\.[a-zA-Z0-9_]+)*\@[a-zA-Z0-9_]+(\.[a-zA-Z0-9_]+)*\.[a-zA-Z]{2,4}$/';
$pattern_message = '/^[a-zA-Z0-9]{2}/';
$pattern_phone = '/^([0-9]{9,10})/';
if ($email != '' && $message != '' && $phone != ''&& $name != '') {
if (preg_match($pattern_email, $email)&& preg_match($pattern_name, $name)&& preg_match($pattern_message, $message)&& preg_match($pattern_phone, $phone) ) {
$headers = 'From: ' . $email . "\r\n";
$subject = 'Message from ' . $name;
$message_phone= $message.'Phone number: '.$phone;
mail($my_email, $subject, $message_phone, $headers);
echo 'success|<div class="alert alert-success"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Thank you! We will contact you shortly.</div>';
}
elseif(!preg_match($pattern_email, $email)) {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Please enter a valid email address.</div>';
}
elseif(!preg_match($pattern_name, $name)) {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Name must be more then 2 letters.</div>';
}
elseif(!preg_match($pattern_phone, $phone)) {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Phone must be 9-10 digits.</div>';
}
elseif(!preg_match($pattern_message, $message)) {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Message must be more than 2 letters.</div>';
}
} elseif ($name== ''&& $message != '' && $phone != '' && $email != '') {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Please fill name</div>';
}
elseif ($phone== ''&& $message != '' && $name != '' && $email != '') {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Please fill Phone number</div>';
}
elseif ($message== '' && $phone != ''&& $name != '' && $email != '') {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Please fill Massage</div>';
}
elseif ($email== ''&& $message != '' && $phone != ''&& $name != '') {
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Please fill Email address</div>';
}
else{
echo 'error|<div class="alert alert-danger"><button type="button" class="close" data-dismiss="alert"><i class="ion-close"></i></button>Please fill all the fields</div>';
}
}
} else { // Submit form false
header('Location: index.html');
}
?>
的javascript
$('.xone-contact').submit(function() {
var $form = $(this);
var submitData = $form.serialize();
var $phone = $form.find('input[name="phone"]');
var $email = $form.find('input[name="email"]');
var $name = $form.find('input[name="name"]');
var $message = $form.find('textarea[name="message"]');
var $submit = $form.find('input[name="submit"]');
var $dataStatus = $form.find('.data-status');
$email.attr('disabled', 'disabled');
$phone.attr('disabled', 'disabled');
$name.attr('disabled', 'disabled');
$message.attr('disabled', 'disabled');
$submit.attr('disabled', 'disabled');
$dataStatus.show().html('<div class="alert alert-info"><strong>Loading...</strong></div>');
$.ajax({ // Send an offer process with AJAX
type: 'POST',
url: 'assets/contact_form/process-contact.php',
data: submitData + '&action=add',
dataType: 'html',
success: function(msg){
if (parseInt(msg, 0) !== 0) {
var msg_split = msg.split('|');
if (msg_split[0] === 'success') {
$phone.val('').removeAttr('disabled');
$email.val('').removeAttr('disabled');
$name.val('').removeAttr('disabled');
$message.val('').removeAttr('disabled');
$submit.removeAttr('disabled');
$dataStatus.html(msg_split[1]).fadeIn();
} else {
$phone.removeAttr('disabled');
$email.removeAttr('disabled');
$name.removeAttr('disabled');
$message.removeAttr('disabled');
$submit.removeAttr('disabled');
$dataStatus.html(msg_split[1]).fadeIn();
}
}
}
});
return false;
});