我正在使用带有jquery / javascript的bootstrap3表单来验证输入。取自here
这是我表格的一部分:
<form id="contact-form" action="#" class="form-horizontal">
<fieldset>
<div class="form-group">
<label class="sr-only" for="name">Your Name</label>
<div class="controls">
<input type="text" class="input-xlarge form-control" name="name" id="name" placeholder="Your Name">
</div>
</div>
<div class="form-group">
<label class="sr-only" for="email">Email Address</label>
<div class="controls">
<input type="text" class="input-xlarge form-control" name="email" id="email" placeholder="Email">
这是JavaScript:
<script>
$(document).ready(function(){
jQuery.validator.setDefaults({
errorClass: "help-block"
});
$('#contact-form').validate({
rules: {
name: {
minlength: 3,
regex: "/^[A-Za-z\']*$/",
required: true
},
email: {
required: true,
email: true
},
subject: {
minlength: 2,
required: true
},
message: {
minlength: 2,
maxlength: 400,
required: true
}
},
highlight: function(element) {
$(element).closest('.control-group').removeClass('success').addClass('error');
},
success: function(element) {
element
.text('OK!').addClass('valid')
.closest('.control-group').removeClass('error').addClass('success');
}
});
}); // end document.ready
</script>
必填字段和位数非常好。我还打算添加进一步的验证,例如,在名称字段中接受字母。我曾尝试使用正则表达式,但似乎无法正常工作。
如何在这种类型的javascript验证中使用正则表达式(或多个)验证?
当字段具有多个验证(仅字母和超过3个字符)时,如何给出适当的错误消息?
我是Web开发的新手,因此这些问题可能会出现。现在就开始使用HTML。请引导正确的方向。
最佳答案
对于电子邮件,您应该添加以下内容:
$.validator.addMethod("email", function(value, element) {
return this.optional(element) || /^[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,5}$/i.test(value);
}, "Invalid email address");
那么电子邮件的规则应为:
email: "required email",