Jquery Validate设置onkeyup:false后二次选中字段仍触发keyup校验问题

问题根因 #

异常触发有两个核心原因：

• 初始校验配置未加onkeyup: false参数：jQuery Validation插件默认规则是字段从未校验过时只在失焦时触发校验，一旦字段完成过一次校验（也就是首次失焦校验后），就会自动开启keyup实时校验，只有初始化校验器时显式传入onkeyup: false才能全局禁用该逻辑。
• 后续给不存在的#myform调用了validate()方法完全不生效，你的表单id是form1，且validate()方法只能对同一个表单初始化一次，后续调用不会覆盖原有配置，只会返回已存在的校验器实例。

修复方案 #

直接把onkeyup: false参数加到初始校验配置里即可，修改后的代码如下：

<form id="form1" runat="server">
    <div style="padding: 100px;">
        <div class="control-group">
            <label for="claimNumber" class="control-label" style="width: 200px;">Claim #*</label>
            <div class="controls" style="margin-left:20px">
                <input type="text" class="form-control span3" id="claimNumber" name="claimNumber" maxlength="128"/>
                <button style="margin-left: 10px">Validate</button>
            </div>
        </div>
    </div>
</form>
<script>
    var isUsed;
    var form = $("#form1").show();
    
    var form1ValidationRules = {
         onkeyup: false, // 新增这一行，全局禁用keyup校验逻辑
         rules: {
            claimNumber: {
                uniqueClaim: true,
                required: true
            }
        }
    };

    var validateForm = function () {
        $('input,select,textarea', 'div.hide').not('input[type=radio]').each(function () {
            $(this).val('');
        });
        // 这里调用validate不会重新初始化，会返回已有的校验器实例，不需要修改
        return $("#form1").validate(form1ValidationRules).form();
    };

    $(document).ready(function () {
        $.validator.addMethod(
            "uniqueClaim",
            function () {
                console.log("validating");
                return (isUsed == false)
            },
            "Claim number is already in use for your company."
        );

        $('form#form1').validate(form1ValidationRules);
        // 删除原来的$('#myform').validate那段无效代码
    });
</script>

可选进阶配置 #

如果你只想给claimNumber这一个字段禁用keyup校验，其他字段保留默认逻辑，可以按下面的方式配置：

var form1ValidationRules = {
     onkeyup: function(element, event) {
        // 只跳过claimNumber字段的keyup校验，其他字段走默认逻辑
        if ($(element).attr('name') === 'claimNumber') {
            return false;
        }
        // 调用默认onkeyup逻辑
        $.validator.defaults.onkeyup.call(this, element, event);
     },
     rules: {
        claimNumber: {
            uniqueClaim: true,
            required: true
        }
    }
};

内容的提问来源于stack exchange，提问作者mdsplat-ta