javascript - jQuery 自定义规则总是返回 true

Question

我正在使用带有 jQ​​uery 步骤和 jQuery 验证的 jQuery。

我为一段代码编写了一些自定义规则，但是，这些规则无法正常工作。

这是我的html代码：

<h2>Second Step</h2>
<section>
    <form id="SecondStep" >
        <section class="expose">
            <div class="label-field clearfix">
                <fieldset data-role="controlgroup">
                    <legend>Textbox</legend>
                    <input type="text" id="textbox" name="textbox" />
                </fieldset>
            </div>
            <div class="label-field clearfix">
                <fieldset data-role="controlgroup">
                    <legend>Password</legend>
                    <input type="password" id="password" name="password" />
                </fieldset>
            </div>
        </section>
    </form>
</section>

这是我的自定义规则：

$("#SecondStep").validate({
    rules: {
        textbox: "required",
        password: {
            required: true,
            minlength: 5
        }
    },
    messages: {
        textbox: "Please enter information into the textbox",
        password: {
            required: "Please enter a password",
            minlength: "Your password must consist of at least 5 characters"
        }                           
    }
});

这是我从按钮的 onClick 调用以测试我的自定义规则的代码：

function validateAllElements()
{
     var isValid = $("#SecondStep").valid(); 
     alert(isValid);
}

当我调用 validateAllElements 函数时，即使文本框和密码表单元素中根本没有值，.valid 方法也会返回 true。

我可以对这段代码有一些帮助吗？

提前致谢

Answer 1

在使用JSFiddle进行几次测试后，如果将代码包装到$(document).ready(function() {}).

$(document).ready(function() {
    $("#SecondStep").validate({
    rules: {
        textbox: "required",
        password: {
            required: true,
            minlength: 5
        }
    },
    messages: {
        textbox: "Please enter information into the textbox",
        password: {
            required: "Please enter a password",
            minlength: "Your password must consist of at least 5 characters"
        }                           
    }
    });
    $('#test').click(function () {
         var isValid = $("#SecondStep").valid(); 
         alert(isValid);
    });
});