jQuery 验证多个输入字段

Question

我有 4 个输入字段，如下图所示。

代码如下。

<input class="form-control licence-group" name="LicenceNumber1" id="LicenceNumber1" type="text">

<input class="form-control licence-group" name="LicenceNumber1Date" id="LicenceNumber1Date" type="text">


<input class="form-control licence-group2" name="LicenceNumber2" id="LicenceNumber2" type="text">

<input class="form-control licence-group2" name="LicenceNumber2Date" id="LicenceNumber2Date" type="text">

我正在 jQuery Step Plugin 中使用它。

我想用以下条件验证这一点。

所有字段都是必需的
如果填写了 LicenceNumber1 和 LicenceNumber1Date 则不需要 LicenceNumber2 和 LicenceNumber2Date 字段。
与填写 LicenceNumber2 和 LicenceNumber2Date 一样，然后不需要 LicenceNumber1 和 LicenceNumber1Date 字段。
每对输入字段都是必需的（例如：许可证号和日期）
如果填写了 3 个字段，则需要填写其他剩余字段。 EG: 许可证 1，许可证 1 日期，许可证 2 已填写，然后需要许可证 2 日期。

我使用了下面的代码。但是没用。

rules: {
            LicenceNumber1: {
                required: function (element) {
                    return (($("#LicenceNumber1Date").is(':empty')) && ($("#LicenceNumber2").is(':empty') || $("#LicenceNumber2Date").is(':empty')) );
                }
            },
              LicenceNumber1Date: {
                  required: function (element) {
                      return (($("#LicenceNumber1").is(':empty')) && ($("#LicenceNumber2").is(':empty') || $("#LicenceNumber2Date").is(':empty')));

                }
            },
            LicenceNumber2: {
                required: function (element) {
                    return (($("#LicenceNumber2Date").is(':empty')) && ($("#LicenceNumber1").is(':empty') || $("#LicenceNumber1Date").is(':empty')));
                }
            },
            LicenceNumber2Date: {
                required: function (element) {
                    return (($("#LicenceNumber2").is(':empty')) && ($("#LicenceNumber1").is(':empty') || $("#LicenceNumber1Date").is(':empty')));  
                }
            } 
        }

请假设我已将输入 ID 更改为可理解的。如果没有 jquery 验证插件并使用普通 jquery 也可以。如果有人可以帮助我正确验证这一点，非常感谢您的帮助。谢谢

Answer 1

    //logic 1 check all empty
    var rul1 = true;
    //check first row
    var rul2 = true;
    //check secon row
    var rul3 = true;
    if ($('#LicenceNumber1').val() == '' && $('#LicenceNumber1Date').val() == '' && $('#LicenceNumber2').val() == '' && $('#LicenceNumber2Date').val() == '') {
        rul1 = false;
        alert('all empty')
    } else {
        //logic 2 check first row
        if (($('#LicenceNumber1').val() != '' && $('#LicenceNumber1Date').val() == '') || ($('#LicenceNumber1').val() == '' && $('#LicenceNumber1Date').val() != '')) {
            rul2 = false;
            //here write code for show empty labels on first row
            alert('first row invalid')
        }

        //logic 3nd second row
        if (($('#LicenceNumber2').val() != '' && $('#LicenceNumber2Date').val() == '') || ($('#LicenceNumber2').val() == '' && $('#LicenceNumber2Date').val() != '')) {
            rul3 = false;
            //here write code for show empty labels on seconrow
            alert('second row invalid')
        }

    }

    //proceed 
    if (rul1 == true && rul2 == true && rul3 == true) {
        alert('submit')
    }

jQuery 验证多个输入字段

jQuery validation for multiple input fileds

jquery

jquery-validate

jquery-steps