【原】《锋利的JQuery》读书笔记(三)

 

三、JQuery中的事件和动画

1、$(document).ready()  执行时机——DOM就绪

2、load()方法

    【1】如果绑定window   $(window).load() 所有元素都加载完才执行

    【2】如果绑定元素, 元素加载完就执行

3、$(this) 将当前的DOM元素转成JQuery对象

4、is()方法用于判断

5、绑定事件 bind() ——形式 bind("click",function(){})

6、绑定事件的简写:去掉bind() ,直接 .click(function(){})

7、合成事件两个

   hover() ——>鼠标悬停切换

   toggle()——>鼠标单击切换,可见状态切换

8、事件冒泡

    【1】定义:后代中事件触发会逐级向上触发父级的事件

     【2】停止事件冒泡:

              bind("click",function(event){

               ........

               event.stopPropagation();   //写上这句就不会触发上级的事件了

                });

     【3】阻止默认的行为:点击按钮会提交、点击链接会跳转

            event.preveentDefault();

     【4】以上两种情况可以直接用一句话搞定:return false;

9、事件对象

【1】event.type() 事件类型

【2】event.preventDefault() 阻止默认事件

【3】event.stopPropagation()停止事件冒泡

【4】event.target 获得触发事件的元素

【5】event.pageX()/event.pageY() 鼠标的x,y 坐标

【6】event.which 鼠标单击哪个键(1,左 2、中  3、右)

【7】event.metakey()   获得<ctrl>按键

10、移除事件  unbind()

[1]unbind(type) 移除特定的一类事件

[2]unbind(type,func()) 移除某个事件

[3]unbind() 移除所有事件

one() 绑定的事件只触发一次

11、模拟操作 trigger()

12、bind的其他功能

绑定多个事件

添加事件命名空间

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

13、JQuery的动画

【1】可见、不可见

show()或 show(1000)

hide() 或hide(1000)

【2】淡入淡出

fadeIn()

fadeOut()

【3】高度变化

slideUp()

sildeDown()

【4】animate()方法

animate(样式,速度,动画完成时的方法)————都是可选的

14、多重动画:按照动画的顺序与动画拆开写

15、动画回调函数:解决动画结束后欲改变CSS样式或执行某些行为的方法

16、stop()停止元素的动画

       stop(true) 停止多个连续的动画

      stop(true,true) 停止当前动画并到达当前动画的末状态

17、判断是否处于动画状态

$(element).is(":animated") 返回布尔值

18、其他动画

 toggle() 切换隐藏、可见

slideToggle() 切换改变高度的隐藏、可见

fadeTO(600,0.2)  0.6秒调整到指定的2%不透明度 

作者:Tony zhao 欢迎访问:找与淘网

本文出处:http://www.cnblogs.com/ytaozhao    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

原文地址:https://www.cnblogs.com/ytaozhao/p/2567788.html