JQuery 常用方法和事件详细介绍


Posted in Javascript onApril 18, 2013

文档就绪函数
$(document).ready(function(){
--- jQuery functions go here ----
});
这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码。
如果在文档没有完全加载之前就运行函数,操作可能失败。(试图隐藏一个不存在的元素;获得未完全加载的图像的大小)

把所有 jQuery 代码置于事件处理函数中
把所有事件处理函数置于文档就绪事件处理器中

hide/show/toogle
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
$(selector).toggle(speed,callback);
可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示或切换完成后所执行的函数名称。

jQuery 事件

Event 函数 绑定函数至
$(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件

jQuery Fading 方法:

通过 jQuery,您可以实现元素的淡入淡出效果。

jQuery 拥有下面四种 fade 方法:

  • fadeIn()
  • fadeOut()
  • fadeToggle()

可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。可选的 callback 参数是 fading 完成后所执行的函数名称。

  • fadeTo()

jQuery fadeTo() 方法允许渐变为给定的不透明度(值介于 0 与 1 之间)。

$(selector).fadeTo(speed,opacity,callback);

必需的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

必需的 opacity 参数将淡入淡出效果设置为给定的不透明度(值介于 0 与 1 之间)。

  可选的 callback 参数是该函数完成后所执行的函数名称。

由于 JavaScript 语句(指令)是逐一执行的,按照次序,动画之后的语句可能会产生错误或页面冲突,因为动画还没有完成。

为了避免这个情况,您可以以参数的形式添加 Callback 函数。如果您希望在一个涉及动画的函数之后来执行语句,请使用 callback 函数。

Javascript 相关文章推荐
JavaScript confirm选择判断
Oct 18 Javascript
jquery实现保存已选用户
Jul 21 Javascript
JavaScript弹出新窗口并控制窗口移动到指定位置的方法
Apr 06 Javascript
JavaScript实现删除,移动和复制文件的方法
Aug 05 Javascript
JS实现的驼峰式和连字符式转换功能分析
Dec 21 Javascript
jquery实现多次上传同一张图片
Jan 09 Javascript
使用JavaScript进行表单校验功能
Aug 01 Javascript
Vue.js实现列表清单的操作方法
Nov 15 Javascript
详解vscode中vue代码颜色插件
Oct 11 Javascript
JavaScript变速动画函数封装添加任意多个属性
Apr 03 Javascript
浅析webpack-bundle-analyzer在vue-cli3中的使用
Oct 23 Javascript
vant-ui框架的一个bug(解决切换后onload不触发)
Nov 11 Javascript
基于JQuery 滑动与动画的说明介绍
Apr 18 #Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
Apr 18 #Javascript
基于JQuery 选择器使用说明介绍
Apr 18 #Javascript
关于jquery css的使用介绍
Apr 18 #Javascript
js字符串转换成xml对象并使用技巧解读
Apr 18 #Javascript
jQuery使用技巧简单汇总
Apr 18 #Javascript
document.documentElement的一些使用技巧
Apr 18 #Javascript
You might like
全国FM电台频率大全 - 4 山西省
2020/03/11 无线电
PHP5 安装方法
2007/01/15 PHP
PHPMailer 中文使用说明小结
2010/01/22 PHP
dedecms系统的广告设置代码 基础版本
2010/04/09 PHP
完善CodeIgniter在IDE中代码提示功能的方法
2014/07/19 PHP
php实现比较两个文件夹异同的方法
2015/06/18 PHP
smarty自定义函数用法示例
2016/05/20 PHP
PHP Callable强制指定回调类型的方法
2016/08/30 PHP
PHP配合fiddler抓包抓取微信指数小程序数据的实现方法分析
2020/01/02 PHP
extjs 学习笔记(二) Ext.Element类
2009/10/13 Javascript
js中Image对象以及对其预加载处理示例
2013/11/20 Javascript
JS的参数传递示例介绍
2014/02/08 Javascript
脚本合并提升javascript性能示例
2014/02/24 Javascript
JS实现在线统计一个页面内鼠标点击次数的方法
2015/02/28 Javascript
页面向下滚动ajax获取数据的实现方法(兼容手机)
2016/05/24 Javascript
ztree加载完成后显示勾选节点的实现代码
2018/10/22 Javascript
node上的redis调用优化示例详解
2018/10/30 Javascript
JS数组方法slice()用法实例分析
2020/01/18 Javascript
JavaScript常用工具函数汇总(浏览器环境)
2020/09/17 Javascript
python实现颜色rgb和hex相互转换的函数
2015/03/19 Python
Python3.2中的字符串函数学习总结
2015/04/23 Python
python提取字典key列表的方法
2015/07/11 Python
Python实现的简单排列组合算法示例
2018/07/04 Python
Django中使用Celery的教程详解
2018/08/24 Python
Python统计时间内的并发数代码实例
2019/12/28 Python
Spartoo瑞典:鞋子、包包和衣服
2018/09/15 全球购物
工程项目经理岗位职责
2013/12/15 职场文书
物理系毕业生自荐书范文
2014/02/22 职场文书
关于抽烟的检讨书
2014/02/25 职场文书
2014年寒假社会实践活动心得体会
2014/04/07 职场文书
会员活动策划方案
2014/08/19 职场文书
商铺门面租房协议书
2014/10/21 职场文书
师德承诺书2015
2015/04/28 职场文书
导游词之徐州-云龙山
2019/09/29 职场文书
Python如何利用正则表达式爬取网页信息及图片
2021/04/17 Python
彻底理解golang中什么是nil
2021/04/29 Golang