我正在使用Java servlet和JSP开发一个网页。我目前在登录页面上遇到了使用HTML表单和使用Jquery使用regex模式进行快速客户端验证的问题。我正在最新版本的Intellij ultimate上运行和编译。
当使用正则表达式模式编写验证并第一次测试时,它运行得非常好,并且只有在破坏正则表达式模式时才显示消息。然而,现在,在启动我的笔记本电脑后,它说即使我给出了有效的输入,我的模式也被打破了。我已经在线测试了我的正则表达式,我所有的模式都在做我想做的事情
出于某种原因,它允许我在输入字段中输入一个字符,它接受了它,但只接受了一个以上的字符,并显示我的消息,说模式已被破坏。
这是我写它的方式有问题还是Jquery的错误?
edit:在重新启动我的笔记本电脑后,我现在根本没有得到任何验证,就好像它没有检测到我的javascript文件。
我把我的javascript写在了一个不同的文件中,并在标题中链接了使用Jquery:的链接
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.min.js"></script>
<script src="form_validation.js"></script>
我的表格:
<form action="CreateAccount" method="post" name = "CreateAccountForm" id = "CreateAccountForm">
<label for="firstname">First name:</label><br>
<input type="text" id="firstname" name="firstname"><br>
<label for="lastname">Last name:</label><br>
<input type="text" id="lastname" name="lastname"><br>
<label for="username">Username:</label><br>
<input type="text" id="username" name="username"><br>
<label for="password">Password</label><br>
<input type="password" id="password" name="password"><br>
<label for="phone">Phone Number</label><br>
<input type="text" id="phone" name="phone"><br>
<label for="email">Email</label><br>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Submit">
</form>
我的Jquery:
$(function () {
$('CreateAccountForm').validate({
rules: {
firstname:{
required:true,
pattern: /^[a-zA-Z]+$/,
maxlength: 50
},
lastname:{
required:true,
pattern: /^[a-zA-Z]+$/,
maxlength: 50
},
username:{
required:true,
pattern: /^[^ ]+$/,
maxlength: 50
},
password:{
required:true,
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*d)[a-zA-Zd]{8,15}$/
},
phone:{
required:true,
pattern: /^d{2}-d{4}-d{7}$/
},
email:{
required:true,
email:true,
maxlength: 50
}
},
messages:{
firstname:{
required: " A first name is required",
pattern: " First name must only contain characters a-z",
maxlength: "Must be less than 50 characters"
},
lastname:{
required: " A last name is required",
pattern: " Last name must only contain characters a-z",
maxlength: "Must be less than 50 characters"
},
username:{
required: " A user name is required",
pattern: " User name cannot have spaces",
maxlength: "Must be less than 50 characters"
},
password:{
required: " A password is required",
pattern: " Password must contain: " +
"At least one upper case letter, " +
"At least one lower case letter, " +
"At least one number " +
"and be between 8-15 characters."
},
phone:{
required: " A phone number is required",
pattern: " Phone number must be in the format **-****-*******"
},
email:{
required: " An email is required",
email: " Not a valid email address format",
maxlength: "Must be less than 50 characters"
}
}
})
})
根据文档,没有max_length
验证,要使用的正确验证是maxlength
。这样的东西:
firstname:{
required:true,
pattern: /^[a-zA-Z]+$/,
maxlength: 50
}, // etc.