我们讲解下表单的使用,我们先讲解原生的javascript表单验证的写法,然后介绍使用插件验证表达。都可以解决我们问题,只是一个有一定的代码基础,还有种懂点js语法也可以修改达到表单验证。
今天介绍jQuery Validation插件的用法
我们引用插件包,然后按照语法使用$("form").validate();就可以了,是不是节省了很多代码量。我们还可以设置属性,比如minlength="2"
设置最大长度和最小长度。验证不通过会在文本右边提示错误信息。默认的是英文,我们可以修改js文件改成中文
<!doctype html> <html> <head> <meta charset="utf-8"> <title>jQuery Validation</title> <script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="//freemuban.com/js/507/jquery.validate.js"></script> <script type="text/javascript"> $(function(){ $("form").validate(); }) </script> <style type="text/css"></style> </head> <body> <h1>jQuery Validation表单验证</h1> <form action="" method="POST" class="niceform p1"> <div> <label>姓 名:</label> <input type="text" name="inputtext" class="required" minlength="2"/> </div> <div> <label>Email:</label> <input id="cemail" name="email" class="required email" /> </div> <div> <label> URL :</label> <input id="curl" name="url" class="url" value="" /> </div> <div class="clear"></div> </form> </body> </html>