Question

jquery验证支持逐步验证，即我已经在一个表单中实施了一个包含20个问题的调查问卷，逐步显示并隐藏每个问题（继续按下按钮）。按下按钮时，会显示下一个问题。

我想我必须触发clicked事件的验证并切换当前问题的验证。

Answer 1

尝试this代码。

HTML：

<div class="Steps Step_1">
    <h1>Step 01</h1>
    <input id="txtStep_1" type="text" value="" />
    <button id="btnNext" data-next="Step_2">Next</button>
</div>
<div class="Steps Step_2" style="display: none;">
    <h1>Step 02</h1>
    <input id="txtStep_2" type="text" value="" />
    <button id="btnNext" data-next="Step_3">Next</button>
</div>
<div class="Steps Step_3" style="display: none;">
    <h1>Step 03</h1>
    <input id="txtStep_3" type="text" value="" />
    <button id="btnNext">Next</button>
</div>

使用Javascript：

var current = 1;
$('button').on('click', function() {
    if (!window["ValidateStep_" + current]())
        alert('fill form..');

    current++;
    $('.Steps').hide();
    $('.Step_' + current).show();
})

window.ValidateStep_1 = function() {
    return true;
}

window.ValidateStep_2 = function() {
    return true;
}

window.ValidateStep_3 = function() {
    return false;
}

jQuery验证逐步验证

1 个答案: