onfocusout 在某些特定字段上使用 jQuery 验证

onfocusout on some specific fields using jQuery Validate

我正在使用 jQuery 验证插件来验证我的表单。我的表格中有一对出发地和目的地城市以及一对开始和结束日期。我希望 onfocusout 函数仅在机场字段中具有相同代码时才起作用。

我的代码如下...

$(function () {
    var validator = $("#testForm").validate({
        errorClass: "errorMsg",
        errorElement: "span",
        rules: {
            fromAirport: {
                "required": true,
                "onfocusout": true
            },
            toAirport: {
                "required": true,
                "onfocusout": true
            },
            fromDate: {
                "required": true,
                "onfocusout": false
            }
            toDate: {
                "required": true,
                "onfocusout": false
            }
        },
        messages: {
            fromAirport: {
                "required": "fromAirportis required!"
            },
            toAirport: {
                "required": "toAirportis required!"
            }
            fromDate: {
                "required": "fromDateis required!"
            },
            toDate: {
                "required": "toDate is required!"
            },
        },
        onfocusout: function(el) {
            if (!this.checkable(el)){
                this.element(el);
            }
        },
        submitHandler: function (form) {
        }
    });
});

jsFiddle: https://jsfiddle.net/4yegctz5/1/

  1. 关于这段代码...

    onfocusout: function(el) {
        if (!this.checkable(el)){
            this.element(el);
        }
    },
    

什么是checkable?有no such thing represented in this plugin.

  1. 关于这段代码...

    rules: {
        fromAirport: {
            "required": true,
            "onfocusout": true // <- No such rule
        }, ...
    

"onfocusout" 不是规则。它只是一个由表单中的 "event" 触发的回调函数。此外,虽然您可以创建任何自定义规则,但您不能创建影响验证事件的自定义规则。


OP's Title: "onfocusout on some specific fields using jQuery Validate"

您唯一的解决方案是按如下方式覆盖 onfocusout 函数。我只是在要在 onfocusout 事件上评估的任何字段上放置了一个任意的 class。然后自定义 onfocusout 函数使用条件检查此 class 的元素,然后触发验证。

onfocusout: function(element) {
    if ($(element).hasClass('ofo')) {
        this.element(element);
    }
},

演示:https://jsfiddle.net/4yegctz5/3/