Question

所以我有一个七部分表格，其中六个标签通过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();});

Answer 1

如果您使用the jQuery Validate插件和代码，则在点击按钮之前不会初始化插件。如果插件没有初始化，那么就没有验证。

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

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

如果您希望在初始化后随时测试表单，则可以使用.valid() method。

$(document).ready(function () {

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

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

});

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

DEMO：http://jsfiddle.net/pqVJM/

$(document).ready(function () {

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

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

});

jQuery Validation插件在按钮点击时验证表单

1 个答案: