使用JQuery验证验证字段而不提交任何内容？

Question

我有一个HTML5 Web应用程序,其中包含许多用户输入的字段,我想在将这些字段发送到服务器之前对这些字段进行一些客户端验证.容易吗？只需使用JQuery验证插件--- http://jqueryvalidation.org/

但是有一个问题.我的网络应用没有表格.HTML中没有提交任何内容.相反,每个用户可更改的元素上都有一个JQuery更改处理程序,当用户更改其中一个元素的值时,将进行AJAX调用.(这种非标准的用户交互架构对此应用程序有意义.)

我想在AJAX调用之前验证该字段,并使用JQuery验证插件来执行此操作.但我无法弄清楚如何.

是否可以在没有提交的情况下使用JQuery验证插件？我该怎么做？还是另一种方法更好？

Answer 1

首先,最重要的是,您必须将输入元素包装在<form></form>标记内,以便jQuery Validate插件运行.但是,不需要提交按钮.

其次,您可以使用该.valid()方法以编程方式触发任何或所有元素的有效性测试,而无需提交按钮.

$(document).ready(function() {

    $('#myform').validate({  // initialize the plugin on your form.
        // rules, options, and/or callback functions
    });

    // trigger validity test of any element using the .valid() method.
    $('#myelement').valid();

    // trigger validity test of the entire form using the .valid() method.
    $('#myform').valid();

    // the .valid() method also returns a boolean...
    if ($('#myform').valid()) {
        // something to do if form is valid
    }

});

演示:http: //jsfiddle.net/URQGG/