从零开始学习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 相关文章推荐
javascript import css实例代码
Jul 18 Javascript
JavaScript Sort 表格排序
Oct 31 Javascript
js自动闭合html标签(自动补全html标记)
Oct 04 Javascript
JavaScript实现基于十进制的四舍五入实例
Jul 17 Javascript
jquery实现浮动在网页右下角的彩票开奖公告窗口代码
Sep 04 Javascript
jQuery中使用animate自定义动画的方法
May 29 Javascript
javaScript语法总结
Nov 25 Javascript
详解vue.js2.0父组件点击触发子组件方法
May 10 Javascript
IScroll那些事_当内容不足时下拉刷新的解决方法
Jul 18 Javascript
如何将HTML字符转换为DOM节点并动态添加到文档中详解
Aug 19 Javascript
如何在微信小程序里面退出小程序的方法
Apr 28 Javascript
在vue中created、mounted等方法使用小结
Jul 21 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加密解密的代码
2007/07/16 PHP
PHP限制页面只能在微信自带浏览器访问的代码
2014/01/15 PHP
用PHP来计算某个目录大小的方法
2014/04/01 PHP
php检测图片主要颜色的方法
2015/07/01 PHP
php session 写入数据库
2016/02/13 PHP
thinkphp5框架API token身份验证功能示例
2019/05/21 PHP
js实现的日期操作类DateTime函数代码
2010/03/16 Javascript
js innerHTML 改变div内容的方法
2013/08/03 Javascript
js判断为空Null与字符串为空简写方法
2014/02/24 Javascript
JQuery 实现在同一页面锚点链接之间的平滑滚动
2014/10/29 Javascript
日常收藏的jquery技巧
2015/12/02 Javascript
详解原生JavaScript实现jQuery中AJAX处理的方法
2016/05/10 Javascript
JS控制弹出悬浮窗口(一览画面)的实例代码
2016/05/30 Javascript
基于JavaScript实现单选框下拉菜单添加文件效果
2016/06/26 Javascript
轻松实现jquery选项卡切换效果
2016/10/10 Javascript
js实现适合新闻类图片的轮播效果
2017/02/05 Javascript
JS实现的随机排序功能算法示例
2017/06/09 Javascript
JS实现手写parseInt的方法示例
2017/09/24 Javascript
easyui下拉框动态级联加载的示例代码
2017/11/29 Javascript
vue使用自定义icon图标的方法
2018/05/14 Javascript
vue中动态设置meta标签和title标签的方法
2018/07/11 Javascript
vue新建项目并配置标准路由过程解析
2019/12/09 Javascript
javascript实现前端成语点击验证优化
2020/06/24 Javascript
[50:24]VGJ.S vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
python库lxml在linux和WIN系统下的安装
2018/06/24 Python
python3.6根据m3u8下载mp4视频
2019/06/17 Python
Django组件content-type使用方法详解
2019/07/19 Python
简单了解python装饰器原理及使用方法
2019/12/18 Python
python3 中使用urllib问题以及urllib详解
2020/08/03 Python
HTML5 input新增type属性color颜色拾取器的实例代码
2018/08/27 HTML / CSS
丽笙酒店官方网站:Radisson Hotels
2019/05/07 全球购物
意大利奢侈品牌在线精品店:Jole.it
2020/11/23 全球购物
临床医学专业求职信
2014/08/08 职场文书
工资证明格式模板
2015/06/12 职场文书
毕业赠语大全
2015/06/23 职场文书
三年级作文之小小梦想
2019/12/06 职场文书