从零开始学习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 相关文章推荐
刷新时清空文本框内容的js代码
Apr 23 Javascript
javascript:void(0)的问题使用探讨
Apr 10 Javascript
jQuery.prop() 使用详解
Jul 19 Javascript
avalon js实现仿google plus图片多张拖动排序附源码下载
Sep 24 Javascript
基于RequireJS和JQuery的模块化编程日常问题解析
Apr 14 Javascript
jquery获取复选框checkbox的值实现方法
May 30 Javascript
基于Bootstrap的Metronic框架实现条码和二维码的生成及打印处理操作
Aug 29 Javascript
JavaScript切换搜索引擎的导航网页搜索框实例代码
Jun 11 Javascript
ajax+node+request爬取网络图片的实例(宅男福利)
Aug 28 Javascript
通过webpack引入第三方库的方法
Jul 20 Javascript
Vue-CLI 项目在pycharm中配置方法
Aug 30 Javascript
如何解决vue在ios微信"复制链接"功能问题
Mar 26 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
mysql 性能的检查和优化方法
2009/06/21 PHP
tp5(thinkPHP5)操作mongoDB数据库的方法
2018/01/20 PHP
PHP 应用容器化以及部署方法
2018/02/12 PHP
PHP实现的多维数组去重操作示例
2018/07/21 PHP
统一接口:为FireFox添加IE的方法和属性的js代码
2007/03/25 Javascript
深入聊聊Array的sort方法的使用技巧.详细点评protype.js中的sortBy方法
2007/04/12 Javascript
JS案例分享之金额小写转大写
2014/05/15 Javascript
JavaScript 弹出子窗体并返回结果到父窗体的实现代码
2016/05/28 Javascript
原生js实现秒表计时器功能
2017/02/16 Javascript
JS中把函数作为另一函数的参数传递方法(总结)
2017/06/28 Javascript
KOA+egg.js集成kafka消息队列的示例
2018/11/09 Javascript
vue-cli 2.*中导入公共less文件的方法步骤
2018/11/22 Javascript
JavaScript中构造函数与原型链之间的关系详解
2019/02/25 Javascript
vue 实现tab切换保持数据状态
2020/07/21 Javascript
js 实现碰撞检测的示例
2020/10/28 Javascript
[02:03]永远的信仰DOTA2 中国军团历届国际邀请赛回顾
2016/06/26 DOTA
[01:06:59]完美世界DOTA2联赛PWL S2 Magma vs FTD 第一场 11.29
2020/12/02 DOTA
python进阶教程之循环相关函数range、enumerate、zip
2014/08/30 Python
在Django中进行用户注册和邮箱验证的方法
2016/05/09 Python
Python命令启动Web服务器实例详解
2017/02/23 Python
Python+OpenCV人脸检测原理及示例详解
2020/10/19 Python
python+pandas分析nginx日志的实例
2018/04/28 Python
Python 数值区间处理_对interval 库的快速入门详解
2018/11/16 Python
详解pyppeteer(python版puppeteer)基本使用
2019/06/12 Python
python实现微信自动回复机器人功能
2019/07/11 Python
关于Python 中的时间处理包datetime和arrow的方法详解
2020/03/19 Python
中文系师范生自荐信
2013/10/01 职场文书
投标单位介绍信
2014/01/09 职场文书
幼儿园元旦活动感言
2014/03/02 职场文书
教师节宣传方案
2014/05/23 职场文书
户外活动总结
2015/02/04 职场文书
2015双创工作总结
2015/07/24 职场文书
Python列表删除重复元素与图像相似度判断及删除实例代码
2021/05/07 Python
python机器学习Github已达8.9Kstars模型解释器LIME
2021/11/23 Python
Java实现注册登录跳转
2022/06/16 Java/Android
SpringBoot使用AOP实现统计全局接口访问次数详解
2022/06/16 Java/Android