9

所以我有一个七部分的表单，其中六个选项卡通过 CSS 隐藏，当用户单击下一个时，另一个部分淡入。

我已提交页面以确保插件正常工作；它是。本质上它只是进入表单的下一部分而不验证当前部分

举个例子

HTML

<form id = "form1" action = "backend.php" method = "post">
<label for "phone">First Name </label>
    <input type = "text" name = "fName" placeholder = "First Name..." class = "required" id = "fName" />
<button id = "btn" type = "button" class = "buttonnav next">next</button>
</form>

Javascript

$('#btn').click( function() { $("#form1").validate();});
4

1 回答 1

21

如果您在代码中使用jQuery Validate插件，则在单击按钮之前，该插件不会被初始化。如果插件未初始化，则没有验证。

$('#btn').click( function() { $("#form1").validate();});

相反，.validate()在 DOM 上调用一次，准备在表单上初始化插件。

如果要在初始化后随时测试表单，可以.valid()使用.

$(document).ready(function () {

    $('#form1').validate({ // initialize plugin
        // your options
    });

    $('#btn').click( function() { 
        $("#form1").valid();  // test the form for validity
    });

});

我不知道您如何设置每个部分以相互交互或使用其他代码。仅基于您的 OP，这是一个使用我上面的答案的工作示例。

演示：http: //jsfiddle.net/pqVJM/

$(document).ready(function () {

    $('#form1').validate();

    $('#btn').click(function () {
        if ($("#form1").valid()) {
            alert('hello - valid form');
        }
    });

});
于 2013-03-15T18:11:24.713 回答