Question

我有一个表单，我在查看隐藏输入时遇到问题，只是为了验证是否输入了密码字段。

<div class="form-group">
    <label for="password" class="control-label col-sm-4">Password: </label>
    <div class="col-lg-6">
        <input type="password" placeholder="Your Password" id="password" name="password" class="form-control" autocomplete="off">
    </div>
</div>

<div class="form-group">
    <label class="control-label col-sm-4">Password Strength</label>
    <div class="col-sm-6" id="password-meter">
        <div class="progress">
            <div class="progress-bar" id="password-meter-progress"></div>
            <input type="hidden" name="password_strength" id="password_strength">
        </div>
    </div>
</div>

<div class="form-group">
    <label for="confirm_password" class="control-label col-sm-4">Confirm Password: </label>
    <div class="col-lg-6">
        <input type="password" placeholder="Confirm Password" id="confirm_password" name="confirm_password" class="form-control" autocomplete="off">
    </div>
</div>

如果我点击这样的按钮，它什么都不做。我已经尝试退出v.errorList，但没有看到任何内容

$('#button').click(function() {
    if (v.form()) {
        $('.frm').hide('fast');
        $('#sf2').show('slow');
    }
});

这是我的验证码

function isPasswordPresent() {
    return $('#password').val() !== '';
}
var v = $('#onboardingform').validate({
    ignore: [],
    rules: {
        password: {
            required: true,
            minlength: 6,
        },
        confirm_password: {
            required: true,
            minlength: 6,
            equalTo: "#password",
        },
        password_strength: {
             min: {
                depends: isPasswordPresent,
                param: 60
            }
        }
    },
    messages: {
        password_strength: {
            min: 'Enter a strong password'
        }
    },
    errorElement: "span",
    errorClass: "help-inline",
});

Answer 1

引用comment：

“我发现问题出在ignore: []上。如果我删除该表单验证正常但我的依赖规则不再有效”

这没有任何意义。 ignore: []只是意味着不理会任何事情;验证所有字段，包括所有隐藏字段。因此，如您的标题所示，如果您要验证隐藏字段，则必须相应地设置ignore选项，例如[]。

此外，无需编写外部函数来测试字段是否包含值。该插件为此提供了:filled和:blank选择器。

使用$('#password').is(':filled')查看是否已填写，或者您可以使用!$('#password').is(':blank')确保其不为空。

password_strength: {
    min: {
        depends: function(element) {
            return $('#password').is(':filled');
            // return !$('#password').is(':blank');
        },
        param: 60
    }
}

见：jqueryvalidation.org/category/selectors/

概念验证演示：jsfiddle.net/g6hq8o7y/

jQuery仅在其他字段具有值时才验证隐藏输入

1 个答案: