日期:2014-05-16 浏览次数:20382 次
FV = { errMsg: { //检查特定字段是否为必填 required: { msg: "该字段为必填项.", test: function(obj, load) { //确保字段尚未有内容输入,并在页面加载时不作检查 return obj.value.length > 0 || load; } }, //确保字段内容是正确的email地址 email: { msg: "Email地址格式不正确.", test: function(obj) { //确保有内容的输入并符合email地址的格式 return !obj.value || /^[a-z0-9_+.-]+@([a-z0-9-]+\.)+[a-z0-9]{2,4}$/i.test(obj.value); } }, //确保字段内容符合MM/DD/YYYY的时间格式 date: { msg: "日期格式不正确", test: function(obj) { //确保输入了内容并检查是否符合MM/DD/YYYY的时间格式 return !obj.value || /^\d{2}\/\d{2}\/\d{2,4}$/.test(obj.value); } }, //确保字段内容是一个正确的URL url: { msg: "URL格式不正确", test: function(obj) { //确保有文本的键入,而且不是默认的http://文本 return !obj.value || obj.value == 'http://' || //确保它是一个正确的URL /^https?:\/\/([a-z0-9-]+\.)+[a-z0-9]{2,4}.*$/.test(obj.value); } }, //确保字段内容是一个整数 integer: { msg: "请输入整数", test: function(obj){ //确保有文本的键入且符合整数格式 return !obj.value || /^\d+$/.test(obj.value); } } }, markRequiredFiled: function() { $("input.required").prev("label").addClass("required"); }, //验证表单所有字段的函数 //form参数应是一个表单元素的引用 //load参数应该是一个布尔值,用以判别验证函数在页面加载时执行还是动态执行 validateForm: function(form, load) { var valid = true; //遍历表单的所有字段元素 //form.elements是表单所有字段的一个数组 for (var i = 0, len = form.elements.length; i < len; i++) { //先隐藏任何错误信息,以防不意的显示 FV.hideErrors(form.elements[i]); //检查字段是否包含正确的内容 if (FV.validateField(form.elements[i], load)) { valid = false; } } //如果字段是不正确的内容返回false,反之返回true return valid; }, //验证单个字段的内容 validateField: function(element, load) { var errors = []; //遍历所有可能的验证技术 for (var name in FV.errMsg) { //查看字段是否有错误类型指定的class var re = new RegExp("(^|\\s)" + name + "(\\s|$)"); //检查元素是否带有该class并把它传递给验证函数 if (re.test(element.className) && !FV.errMsg[name].test(element, load)) { //如果没有通过验证,把错误信息增加到列表中 errors.push(FV.errMsg[name].msg); } } //如果存在错误信息,则显示出来 if (errors.length) { FV.showErrors(element, errors); } //如果字段始终没有得到验证,返回false return errors.length > 0; }, //隐藏当前正显示的任何错误信息 hideErrors: function(element) { //获取当前字段的下一个元素 var next = element.nextSibling; //如果下一个元素是ul并有class为errors if (next && next.nodeName == "UL" && next.className == "errors") { //删掉它(这是我们“隐藏”的含义) element.parentNode.removeChild(next); } }, //显示表单内特定字段的错误信息 showErrors: function(element, errors) { //获取当前字段的下一个元素 var next = element.nextSibling; //如果该字段不是我们指定的包含错误的容器 if (next && (next.nodeName != "UL" || next.className != "errors")) { next = document.createElement("ul"); next.className = "errors"; //并在DOM中把它插入到恰当的地方 element.parentNode.insertBefore(next, element.nextSibling); } //现在有了一个包含错误的容器引用,我们可以遍历所有的错误信息了 for (var i = 0; i < errors.length; i++) { //为每一条错误信息创建新的li包裹器 var li = document.createElement("li"); li.innerHTML