一周乱弹： jquery validate 手动触发方式

约定不等于承诺〃 2022-06-14 06:48 628阅读 0赞

jquery validate 手动触发方式  
1，onkeyup 键盘离开  
2，onfocusout 失去焦点  
3，valid()方法手动调用  
但如果直接按照文档中的用法来用onkeyup和onfocusout会出现：SCRIPT438: 对象不支持“call”属性或方法 这个错误  
要写成：  
onfocusout/onkeyup的默认值是false，如果需要开启对当前文本域的验证，则应该写成：

onfocusout: function(element) { $(element).valid(); }
    onkeyup: function(element) { $(element).valid(); }

valid()就很好理解了，直接根据id或者其它元素选择器调用就可以了。

栗子：  
HTML：

JS:

//验证类型报酬表单
            $("#type-reward-form-1").validate({
                onfocusout: function(element) { 
                    var res = $(element).valid();
                    if(!res) {
                        $(element).css("border-color", "red");
                    }else {
                        $(element).removeAttr("style");
                    }
                },
                rules : {
                    startTime : {
                        required : true
                    },
                    endTime : {
                        required : true
                    },
                    startTime2 : {
                        required : true
                    },
                    endTime2 : {
                        required : true
                    },
                    dailyA : {
                        required : true
                    },
                    dailyB : {
                        required : true
                    },
                    dailyC : {
                        required : true
                    },
                    dailyD : {
                        required : true
                    },
                    dailyE : {
                        required : true
                    },
                },
            });
          // 或者点击保存时手动调用
          //提交表单
        function submitDutyInfo() { 
                var dailyForm =  $("#type-reward-form-1").valid();//dailyForm 为布尔类型
              }

效果：  
![这里写图片描述][SouthEast]

[SouthEast]: /images/20220614/9d74f7fdbe054a60b5e501ee82aa4266.png