锋利的jQuery笔记(七) 插件
来源:互联网 发布:jdk1.7 mac 64下载 编辑:程序博客网 时间:2024/05/03 12:23
几个常用的jQuery插件
表单验证插件——validation
几个步骤
(1)引入:<script src="lib/jquery.validate.js" type="text/javascript"></script>
(2)确定哪个表单需要此插件来验证:$("#commentForm").validate();
(3)对不同字段进行验证规则编码
不同验证写法
1.将所有与验证有关的信息写到class属性中方便管理
(1)引入一个新的插件:<script src="lib/jquery.metadata.js" type="text/javascript"></script>
(2)调用:$("#commentForm").validate({meta: "validate"});
(3)在class属性中编写验证规则,例如:class="{validate:{required:true, minlength:2}}"
2.通过name属性来关联字段和验证规则的验证写法
(1)$("#commentForm").validate( )方法中增加rules属性
(2)定义每个字段的那么属性来匹配验证规则
(3)定义验证规则
例子如下
$("#commentForm").validate({rules: {username: {required: true,minlength: 2},email: {required: true,email: true},url:"url",comment: "required"} });
验证信息
1.可以引入中文的语言库<script src="lib/jquery.validate.messages_cn.js" type="text/javascript"></script>
2.可以自定义验证信息 例:class="{validate:{required:true, minlength:2, messages:{required:'请输入姓名', minlength:'请至少输入两个字符'}}}"
3.美化 通过控制css样式来显示
自定义验证规则
(1)定义:
$.validator.addMethod("formula", //验证方法名称function(value, element, param) {//验证规则return value == eval(param);}, '请正确输入数学公式计算后的结果'//验证提示信息);(2)调用
验证规则里面添加valcode: {formula: "7+9"}
表单插件——Form
核心方法
ajaxForm()和ajaxSubmit()都可以讲表单提交变为Ajax提交方式
参数
可以没有参数,当有一个参数时,这个参数可以是一个回调函数也可以是一个options对象
提交之前验证表单
beforeSubmit会在表单提交之前被调用,返回FALSE的话就阻止表单提交
模态窗口插件——SimpleModel
引用
<script type='text/javascript' src='js/jquery.simplemodal.js'></script>
调用
在获取的元素上调用 例:$('#basic-dialog-ok').modal();
作为一个单独函数使用 例:$.modal(<p>test</p>');
Cookoie插件
引用
<script src="js/jquery.cookie.js" type="text/javascript"></script>
写入
$.cookie('the_cookie','the_value')前一个参数为待写入的cookie名,后一个参数为待写入的值
读取
$.cookie('the_cookie')
删除
$.cookie('the_cookie',null)
UI插件
引用
<script type="text/javascript" src="js/jquery-ui-1.8.18.custom.js"></script>
基本API
draggable(options):让一个DOM对象变成可拖动的对象的方法
draggable(" disable "):暂时禁用拖动
draggable("enable "):重新用拖动启
draggable("destroy"):彻底移除拖动功能
与单击冲突
设置参数delay延迟1毫秒$("#myList").sortable({delay:1});
- 锋利的jQuery笔记(七) 插件
- 锋利的jQuery笔记
- 锋利的jQuery笔记(八)
- 锋利的JQuery(笔记二)
- 《锋利的jQuery》笔记(一)
- 锋利的jQuery学习笔记(一)
- 《锋利的jQuery》学习笔记(1)
- 【锋利的JQuery】 学习笔记
- 《锋利的JQuery》学习笔记
- 锋利的jquery学习笔记
- 《锋利的JQuery》学习笔记
- 《锋利的jQuery》学习笔记
- 锋利的JQuery 学习笔记
- 《锋利的JQuery》学习笔记
- 锋利的JQuery 学习笔记
- 《锋利的jQuery》阅读笔记
- 《锋利的JQuery》学习笔记
- 锋利的JQuery 学习笔记
- 开篇
- 删除单链表第一个元素
- 北京车展新车畅想:斯柯达全新一代明锐
- NYOJ 760 See LCS again
- 有状态Bean中用方法管理conversation
- 锋利的jQuery笔记(七) 插件
- Ubuntu 11.10 x64 安装 Android SDK
- C++中数字与字符串之间的转换
- Android Json解析与总结
- android-sdk-linux/tools/android: java: not found
- 1053. Path of Equal Weight
- Python下的英文预处理
- 黑马程序员---------------IO流
- [MFC成长季]windows API程序逻辑