- 第2版前言
- 本书结构
- 读者对象
- 本书约定
- 读者反馈&示例下载
- 疑难解答&本书勘误
- 第1章 认识 jQuery
- 第2章 jQuery 选择器
- 第3章 jQuery 中的 DOM 操作
- 第4章 jQuery 中的事件和动画
- 第5章 jQuery 对表单、表格的操作及更多应用
- 第6章 jQuery 与 Ajax 的应用
- 第7章 jQuery 插件的使用和写法
- 第8章 用 jQuery 打造个性网站
- 第9章 jQuery Mobile
- 第10章 jQuery 各个版本的变化
- 第11章 jQuery 性能优化和技巧
- 附录A 关于 $(document).ready() 函数
- 附录B Firebug
- 附录C Ajax 的 XMLHttpRequest 对象的属性和方法
- 附录D jQuery $.ajax() 方法的参数详解
- 附录E jQuery 加载并解析 XML
- 附录F 插件 API
- 附录G jQuery 速查表
11.2 jQuery 技巧
如今,越来越多的人在使用jQuery类库。这也意味着,需要越来越多有用的jQuery技巧和解决方案。下面是我整理的一些实用的jQuery技巧。
1.禁用页面的右键菜单
2.新窗口打开页面
3.判断浏览器类型
需要注意的是,在jQuery 1.3版本之后,官方推荐使用$.support来代替$.browser这种检测方式。
4.输入框文字获取和失去焦点
5.返回头部滑动动画
6.获取鼠标位置
7.判断元素是否存在
8.点击div也可以跳转
9.根据浏览器大小添加不同的样式
10.设置div在屏幕中央
11.创建自己的选择器
12.关闭所有动画效果
13.检测鼠标的右键和左键
14.回车提交表单
15.设置全局Ajax参数
16.获取选中的下拉框
17.切换复选框
18.使用siblings()来选择同辈元素
19.个性化链接
20.在一段时间之后自动隐藏或关闭元素
21.使用Firefox和Firebug来记录事件日志
22.为任何与选择器相匹配的元素绑定事件
23.使用css钩子
jQuery.cssHooks是1.4.3新增的方法,当你定义新的CSS Hooks时实际上定义的是getter和setter方法,比如,border-radius这个圆角属性想要成功应用于firefox、webkit等浏览器,需要增加属性前缀,比如-moz-border-radius和-webkit-border-radius。你可以通过定义CSS Hooks将其封装成统一的接口borderRadius,而不是一一设置css属性。代码如下:
更多cssHooks可以查看https://github.com/brandonaaron/jquery-cssHooks。
24.$.proxy()的使用
使用回调方法的缺点之一是当执行类库中的方法后,上下文对象被设置到另外一个元素,比如:
执行下面代码:
你将遇到问题,button元素会消失,而不是panel元素。可以使用$.proxy方法解决这个问题,代码如下:
这样才正确的执行。
25.限制Text-Area域中的字符的个数
26.本地存储
本地存储是HTML 5提供的特性之一。它提供了非常简单的API接口,便于添加你的数据到localStorage全局属性中,代码如下:
事实上对于老的浏览器来说,这并不是个好消息,因为他们不支持,但是我们可以使用jQuery的插件(http://plugins.jquery.com/plugin-tags/localstorage)来提供支持,这种方式可以使得本地存储功能正常工作。
27.解析json数据时报parseError错误
jQuery在1.4版本后,采用了更为严格的json解析方式,即所有内容都必须要有双引号,如果升级jQuery版本后,ajax加载json报错,有可能就是这个原因。比如:
但升级成jQuery 1.4后,都必须加上双引号,格式如下:
28.从元素中除去HTML
29.扩展String对象的方法
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论