插件(plugin)也成为扩展(Extension),是一种遵循一定规范的应用程序接口编写出来的程序。
最新最全的插件可以从Jquery官方网站的插件板块中获取,网站网址为http://plugins.jquery.com/
(由于垃圾邮件、不规范的插件、数据备份、版本维护以及对目前插件站点功能的不满足等多种原因,jQuery官方已经讲项目托管与Github,网址为https://github.com/jquery/plugins.jquery.com)
1、Validation
Validation是一个优秀的表单验证插件,Validation拥有一下优点:
1.1、内置验证规则:拥有必读、数字、E-mail、URL和信用卡号码为19类内置验证规则。
1.2、自定义验证规则:可以方便地自定义验证规则。
1.3、简单强大的验证信息提示:默认验证信息提示,也提供了自定义验证信息覆盖默认提示信息的功能。
1.4、实时验证:可以同归keyup或blur时间触发验证,而不是仅仅表单提交的时候验证。
Validation下载地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation/
简单例子:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery插件的应用</title> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script> <script src="https://cdn.bootcss.com/jquery-validate/1.16.0/jquery.validate.js"></script> <style type="text/css"> *{ font-family: Verdana; font-size: 96%; } lable{ width: 10em; float: left; text-align: center; } lable.error{ float: none; color: red; padding-left: 5em; vertical-align: top; } p{ clear: both; } .main{ margin:0 auto; /*border: 1px solid darkgray;*/ height: 250px; width: 600px; } .submit{ margin-left: 12em; } em{ font-weight: bold; padding-right: 1em; vertical-align: middle; color: red; } </style> <script type="text/javascript"> $(function () { $("#commentForm").validate(); }) </script> </head> <body> <div class="main"> <form action="#" class="cxmform" id="commentForm" method="get"> <fieldset> <legend>一个简单的验证带验证提示的评论例子</legend> <p> <lable for="cursername">姓名:</lable><em>*</em> <input type="text" id="cursername" name="username" size = "25" class="required" minlength="2"> </p> <p> <lable for="cemail">电子邮件:</lable><em>*</em> <input type="text" id="cemail" name="email" size = "25" class="required email" > </p> <p> <