从零开始学习jQuery (十一) 实战表单验证与自动完成提示插件


Posted in Javascript onFebruary 23, 2011

一.摘要

本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案,  即使你会使用jQuery也能在阅读中发现些许秘籍.

本文是介绍两个最常用的jQuery插件. 分别用于表单验证和自动完成提示(类似google suggest).

二.前言

研究别人的作品真是一件花时间而且痛苦的过程. 当然也和本人英文不好有关. 总觉得控件作者写了很多文档但是都不够系统, 需要深入研究很多的实例后才能了解作者的思路.所以学习和研究一个插件需要很高成本, 如果发现了Bug并修复需要的成本也是未知数(本次我花了较少的时间解决了自动完成提示插件的一个中文bug, 但是如果复杂的bug就不会这么简单了.).

对于简单应用我首先推荐上文中的jQuery UI. 但是jQuery UI解决的问题有限. 使用jQuery插件是我们最后的一个好办法---还算是好办法, 起码比自己开发要好吧?

很多jQuery的插件编码异常优美, 看一看艺龙首页现在的城市输入框控件, 除了需要为输入框手工添加很多很多属性(onkeyup, onkeydown等等), 而且还不够通用, 占用服务器资源和网络资源.但是当初也是花费了很久的时间完成的作品.

站在巨人的肩膀上, 让我感觉写脚本和写设计C#程序一样, 都有高度和深度可以挖掘. 除了使用作者开发好的功能, 还可以学习如何开发和封装javascript控件. 看过优秀的jQuery插件作者的代码和设计思想后, 常常自叹设计水平差距居然如此之大, 增加自认为脚本高手, 比较过后就是C#程序员和架构师之间的差距.

希望大家通过本章节介绍的两个插件, 除了学会如何使用,  还能够略微领悟到如何封装和设计javascript控件.

 

三.表单验证插件 validate

在提交表单前常要对用户输入进行校验.ASP.NET的验证控件就是用于此目的, 可以同时进行客户端和服务器端验证. 但是验证控件并没有被所有项目采用. 而且在MVC项目中经常使用自己的客户端验证框架.

在比较了若干表单验证插件后, 决定采用validate插件. 因为其使用简单并且灵活.

插件首页:

Javascript 相关文章推荐
根据鼠标的位置动态的控制层的位置
Nov 24 Javascript
javascript下arguments,caller,callee,call,apply示例及理解
Dec 24 Javascript
jQuery实战之品牌展示列表效果
Apr 10 Javascript
JS中Iframe之间传值的方法
Mar 11 Javascript
js confirm()方法的使用方法实例
Jul 13 Javascript
JavaScript中的eval()函数使用介绍
Dec 31 Javascript
js实现登陆遮罩效果的方法
Jul 28 Javascript
jquery判断对象是否为空并遍历对象的简单实例
Jul 26 Javascript
详解在Vue中有条件地使用CSS类
Sep 30 Javascript
浅谈MUI框架中加载外部网页或服务器数据的方法
Jan 31 Javascript
ES6的异步操作之promise用法和async函数的具体使用
Dec 06 Javascript
vue样式穿透 ::v-deep的具体使用
Jun 04 Javascript
从零开始学习jQuery (十) jQueryUI常用功能实战
Feb 23 #Javascript
从零开始学习jQuery (八) 插播:jQuery实施方案
Feb 23 #Javascript
从零开始学习jQuery (六) jquery中的AJAX使用
Feb 23 #Javascript
从零开始学习jQuery (四) jQuery中操作元素的属性与样式
Feb 23 #Javascript
从零开始学习jQuery (三) 管理jQuery包装集
Feb 23 #Javascript
jQuery的学习步骤
Feb 23 #Javascript
ASP.NET中基于JQUERY的高性能的TreeView补充
Feb 23 #Javascript
You might like
PHP下对数组进行排序的函数
2010/08/08 PHP
php递归遍历删除文件的方法
2015/04/17 PHP
解决ThinkPHP关闭调试模式时报错的问题汇总
2015/04/22 PHP
PHP的PDO操作简单示例
2016/03/30 PHP
有关javascript的性能优化 (repaint和reflow)
2013/04/12 Javascript
JS取文本框中最小值的简单实例
2013/11/29 Javascript
fckeditor粘贴Word时弹出窗口取消的方法
2014/10/30 Javascript
深入理解JavaScript系列(38):设计模式之职责链模式详解
2015/03/04 Javascript
Jquery和Js获得元素标签名称的方法总结
2016/10/08 Javascript
JS中如何实现Laravel的route函数详解
2017/02/12 Javascript
jQuery响应滚动条事件功能示例
2017/10/14 jQuery
使用puppeteer破解极验的滑动验证码
2018/02/24 Javascript
JS实现移动端点击按钮复制文本内容
2019/07/28 Javascript
详解vue beforeEach 死循环问题解决方法
2020/02/25 Javascript
[03:37]2014DOTA2国际邀请赛 主赛事第一日胜者组TOPPLAY
2014/07/19 DOTA
python使用PyFetion来发送短信的例子
2014/04/22 Python
Python中正则表达式的用法实例汇总
2014/08/18 Python
CentOS 6.5中安装Python 3.6.2的方法步骤
2017/12/03 Python
Python3.5.3下配置opencv3.2.0的操作方法
2018/04/02 Python
解决csv.writer写入文件有多余的空行问题
2018/07/06 Python
python ddt数据驱动最简实例代码
2019/02/22 Python
Python 图像对比度增强的几种方法(小结)
2019/09/25 Python
Python的in,is和id函数代码实例
2020/04/18 Python
CSS3 透明色 RGBA使用介绍
2013/08/06 HTML / CSS
澳大利亚领先的在线礼品网站:Gifts Australia
2020/08/15 全球购物
广州地球村科技数据库题目
2016/04/25 面试题
汽车驾驶求职信
2013/10/25 职场文书
行政专员岗位职责说明书
2014/09/01 职场文书
保送生自荐信范文
2015/03/26 职场文书
出纳试用期工作总结2015
2015/05/28 职场文书
餐馆开业致辞
2015/08/01 职场文书
2015教师个人师德工作总结
2015/10/23 职场文书
离婚协议书格式范本
2016/03/18 职场文书
利用Java设置Word文本框中的文字旋转方向的实现方法
2021/06/28 Java/Android
quickjs 封装 JavaScript 沙箱详情
2021/11/02 Javascript
「海贼王」112.9万粉丝纪念图标公布
2022/03/21 日漫