表单验证是我们在做网站或web系统时经常用到的,例如我们在使用注册、或完善个人信息时都会碰到验证我们输入的信息是否符合要求。方法较为简单具体步骤如下:
第一步:导入jquery.metadata.js和jquery.validate.js。
第二步:在提交表单上加属性id=“tempForm"。
第三步:将提交按钮改为type="button",且加入onclick="submitForm()"属性。
第四步:在script中加入方法submitForm。
function submitForm() {
if($("#tempForm").valid()) {
$("#tempForm").submit();
}
}
第五步:加入验证代码,格式如下:
$(function() {
$("#tempForm").validate({
rules: {
"cost.costMoney": {
required: true,
number: true,
maxlength:18
}
},
messages: {
"cost.costMoney": {
required: "<font color='red'>成本金额不能为空</font>",
number: "<font color='red'>成本金额必须为数字</font>",
maxlength:"<font color='red'>成本金额长度不能大于
18</font>"
}
}
});
});
第六步:打开浏览器查看表单验证效果。