JQuery验证各个字段集

Question

我开发了一个包含多个字段集的表单来表示填写完整表单的步骤.通过按钮单击(每个字段集上一个)显示和隐藏字段集,但我想在显示下一个字段集之前验证每个字段集.

我是JQuery的新手,我遇到了一些麻烦.我发现这个指南(http://encosia.com/2009/11/24/asp-net-webforms-validation-groups-with-jquery-validation/)允许我独立验证不同的字段集但我的问题是怎么做我使用该验证来控制相关字段集的显示和隐藏.

我认为这样做的方法是从按钮的每个单击事件创建一个函数,但我似乎无法正确调用验证函数.

我恐怕现在完全糊涂了!救命!!

Answer 1

您可以为每个字段集编写自定义验证函数并使用 .keyup 函数调用它。这是一个例子：

HTML：

<div id="fieldset1">
    <input type="text" name="fname" id="fname">
</div>

<div id="fieldset2">
    <!--hidden using css-->
    <input type="text" name="fname" id="fname">
</div>

JavaScript：

$('#fieldset1 #fname').keyup(function () {
    // Runs every time your keystroke is released on this input
    if($(this).val() == 'Adam') {
        // Checks to see if the field's value is Adam. If it is, then it shows the next fieldset. Otherwise it hides it.
        $('#fieldset2').show();
    } else {
        $('#fieldset2').hide();
    }
}

这显然是一个非常简单的示例，但它说明了您需要做什么才能验证表单并根据用户输入修改 DOM。