jquery validate验证插件
$(document).ready(function () { $.extend($.validator.messages, { required: "必填", remote: "请修正此字段", email: "请输入有效的电子邮件地址", url: "请输入有效的网址", date: "请输入有效的日期", dateISO: "请输入有效的日期 (YYYY-MM-DD)", number: "请输入有效的数字", digits: "只能输入数字", creditcard: "请输入有效的信用卡号码", equalTo: "你的输入不相同", extension: "请输入有效的后缀", maxlength: $.validator.format("最多可以输入 {0} 个字符"), minlength: $.validator.format("最少要输入 {0} 个字符"), rangelength: $.validator.format("请输入长度在 {0} 到 {1} 之间的字符串"), range: $.validator.format("请输入范围在 {0} 到 {1} 之间的数值"), max: $.validator.format("请输入不大于 {0} 的数值"), min: $.validator.format("请输入不小于 {0} 的数值") });//中文包 $.validator.addMethod("compareDate", function (value, element) {//自定义方法 var assigntime = $("#MSTARTTIME").val(); var deadlinetime = value; var reg = new RegExp('-', 'g'); assigntime = assigntime.replace(reg, '/');//正则替换 deadlinetime = deadlinetime.replace(reg, '/'); assigntime = new Date(parseInt(Date.parse(assigntime), 10)); deadlinetime = new Date(parseInt(Date.parse(deadlinetime), 10)); if (assigntime > deadlinetime) { return false; } else { return true; } }, "结束日期必须大于开始日期");//比较日期大小 jQuery.validator.addMethod("minNumber", function (value, element) { var returnVal = true; inputZ = value; var ArrMen = inputZ.split("."); //截取字符串 if (ArrMen.length == 2) { if (ArrMen[1].length > 2) { //判断小数点后面的字符串长度 returnVal = false; return false; } } return returnVal; }, "小数点后最多为两位");//判断小数点 jQuery.validator.addMethod("maxNumber", function (value, element) { var returnVal = true; inputZ = value; var ArrMen = inputZ.split("."); //截取字符串 if (ArrMen.length == 2) { if (ArrMen[0].length > 2) { //判断小数点后面的字符串长度 returnVal = false; return false; } } return returnVal; }, "整数不超过两位");//整数位数 $("#form0").validate({ rules: { FFREQUENCY: { required: true, maxlength: 4,//最大长度 max: 3000, number: true }, FBANDWIDTH: { required: true, maxlength:3, number: true }, MENDTIME: { compareDate: $("#MENDTIME").val(), }, BANDOCCUPANCY: { number: true, maxlength: 5, min: 0.01, max: 100, minNumber: $("#BANDOCCUPANCY").val(), }, AZIMUTH: { number: true, maxlength: 6, min: 0.01, minNumber: $("#AZIMUTH").val(), }, MAXAMPLITUDE: { number: true, maxlength: 5, max: 100, minNumber: $("#MAXAMPLITUDE").val(), maxNumber: $("#MAXAMPLITUDE").val(), }, MINAMPLITUDE: { number: true, maxlength: 5, minNumber: $("#MAXAMPLITUDE").val(), maxNumber: $("#MAXAMPLITUDE").val(), }, AVEAMPLITUDE: { number: true, maxlength: 5, minNumber: $("#AVEAMPLITUDE").val(), maxNumber: $("#AVEAMPLITUDE").val(), }, MAXSNR: { number: true, maxlength: 5, minNumber: $("#MAXSNR").val(), max: 100, }, MINSNR: { number: true, maxlength: 5, minNumber: $("#MINSNR").val(), max: 100, }, DEMODMODE: { maxlength: 36, } }, errorElement:"label",//设置错误信息的标签 errorPlacement: function (error, element) { error.insertAfter(element.next()); }//放置错误信息的位置 });//验证事件 });
jquery的验证
$("#saveBtn").click(function () { var ok1 = false; var ok2 = false; var ok3 = false; var ok4 = false; if ($("#FREQUENCY").val().length <= 12 && $("#FREQUENCY").val() != '') { $("#FREQUENCY").next().next().text(''); ok1 = true; }else { $("#FREQUENCY").next().next().text('长度不超过12位').addClass('state'); } if ($("#BANDWIDTH").val().length <= 12 && $("#BANDWIDTH").val() != '') { $("#BANDWIDTH").next().next().text(''); ok2 = true; } else { $("#BANDWIDTH").next().next().text('长度不超过12位').addClass('state'); }; if ($("#BANDWIDTH").val().length <= 12 && $("#BANDWIDTH").val() != '') { $("#BANDWIDTH").next().next().text(''); ok3 = true; } else { $("#BANDWIDTH").next().next().text('长度不超过12位').addClass('state'); }; if (ok1 && ok2 && ok3) { $('#form0').submit(); } else { return false; } });
关于自写jquery必填项
关于验证的逻辑：就是失去焦点也可以验证，点击也可以验证，但是在点击事件中不必和失去焦点一样验证一遍，因为失焦已经验证过一遍了，报错后不会提交，所以自写验证时先写失焦，最后做个必填验证就好(刷新就不会是这种情况)；
第一种
function validate() { if ($("#SelectCheck").val() == '') { $("#SelectCheck").parent().siblings(".errormessage1").text('必填'); } else { $("#SelectCheck").parent().siblings(".errormessage1").text(''); } if ($("#Start_Time").val() == '') { $("#Start_Time").parent().siblings(".errormessage1").text('必填'); } else { $("#Start_Time").parent().siblings(".errormessage1").text(''); } if ($(".startFrequency").val() == '') { $(".startFrequency").parent().siblings(".errormessage1").text('必填'); } else { $(".startFrequency").parent().siblings(".errormessage1").text(''); } };
太复杂了，改了一下
$("#Searchs").click(function () { $(".errormark").css("display", "none"); $("#SelectCheck,.startFrequency,#Start_Time").each(function () { if ($(this).val() == '') { $(this).parent().siblings(".errormessage1").text('必填'); } else { $(this).parent().siblings(".errormessage1").text(''); } }); if ($("#Start_Time").val() == '' || $("#SelectCheck").val() == '' || $(".startFrequency").val() == '') { return false; }; }); $("#SelectCheck,#Start_Time,.startFrequency").blur(function () { if ($(this).val() == '') { $(this).parent().siblings(".errormessage1").text('必填'); } else { $(this).parent().siblings(".errormessage1").text(''); } $(this).siblings(".errormark").css("display", "none"); })
关于模态框问题，此插件表单验证按钮必须在form标签内，但是模态框中表单是在iframe中，按钮在公共的模态框中，所以可以在表单下添加一个按钮再隐藏，在给模态框的按钮添加点击事件触发。
第三种 时间验证（这是只比较大小的情况，不超过30分钟要转为数字）
var starttime = $('#txtStorageTimeStart').val(); var endtime = $('#txtStorageTimeEnd').val(); var start = new Date(starttime.replace("-", "/").replace("-", "/")); var end = new Date(endtime.replace("-", "/").replace("-", "/")); if(end<start){ return false; }
var val=$('input:radio[name="sex"]:checked').val();
//判断是否radio点击 val == null
第四种 时间相差
function diy_time(time1,time2){ time1 = Date.parse(new Date(time1)); time2 = Date.parse(new Date(time2)); return time3 = '相差'+Math.abs(parseInt((time2 - time1)/1000))+'秒';time4 ='相差'+Math.abs(parseInt((time2 - time1)/1000/3600/24))+'天';} var time1 = "2014-07-10 10:21:12"; var time2 = "2014-07-10 10:21:00"; alert(diy_time(time1,time2));
