锋利的jquery(jQuery中的事件和动画)

来源:互联网 发布:安卓app 编程语言 编辑:程序博客网 时间:2024/06/06 15:48

4.1Jquery中的事件
4.1.1加载DOM
这里写图片描述

加载DOM,$(document).ready()与window.onload区别:
1、执行时机
这里写图片描述

2.Jquery中页面加载load方法

这里写图片描述

多次使用问题:
这里写图片描述

javascript的onload事件一次只能保存对一个函数的引用,会覆盖之前的函数。
这里写图片描述

3.简写方式
这里写图片描述

4.1.2事件绑定
这里写图片描述

例子:
这里写图片描述

3.改变绑定事件的类型
这里写图片描述

4.简写绑定事件
这里写图片描述

4.1.3合成事件
这里写图片描述

这里写图片描述

2.toggle()方法
这里写图片描述

例子:
这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述

4.1.4事件冒泡
1、什么是冒泡
这里写图片描述

2.事件冒泡引发的问题
这里写图片描述

事件对象:
这里写图片描述

停止事件冒泡:
这里写图片描述

例子:
这里写图片描述

可以改成return false;同样是停止事件冒泡。

3.事件捕获
这里写图片描述

4.1.5事件对象的属性
(1)event.type
这里写图片描述

这里写图片描述

(4)event.target
这里写图片描述

(5)event.relatedTarget
这里写图片描述

(6)event.pageX和event.pageY
这里写图片描述

(7)event.witch
这里写图片描述

(8)event.metaKey

这里写图片描述

4.1.6移除事件
1.unbind()
这里写图片描述

2.one()
这里写图片描述

4.1.7模拟操作
1.常用模拟
这里写图片描述

2.触发自定义事件
这里写图片描述

3.传递数据
这里写图片描述

这里写图片描述

4.1.8其他用法
1.绑定多个事件类型
这里写图片描述

2.添加事件命名空间,便于管理
这里写图片描述

3.相同事件名称,不同命名空间执行方法

4.2Jquery中的动画
1.show()方法和hide()方法
这里写图片描述

这里写图片描述

4.2.2 fadeIn()方法和fadeOut()方法
这里写图片描述

4.2.3slideUp()方法和slideDown()方法
这里写图片描述

4.2.4自定义动画
这里写图片描述

例子:
这里写图片描述

2.累加累减动画
这里写图片描述

3.多重动画
(1)同时执行多个动画
这里写图片描述

(2)按顺序执行多个动画
这里写图片描述

4.综合动画
4.2.5动画回调函数
这里写图片描述

阅读全文
0 0