jQuery中的事件和动画

一、鼠标事件

方法	执行时机
click()	鼠标单击时
mouseover()	鼠标指针移过时
mouseout()	鼠标指针移出时
mouseenter()	鼠标指针进入时
mouseleave()	鼠标指针离开时

• mouseover和mouseenter的区别：
• mouseover：鼠标指针进入被选元素时触发，如果鼠标指针在被选元素的子元素上来回进入时也会触发.
• mouseenter：鼠标指针进入被选元素时触发，如果鼠标指针在被选元素的子元素上来回进入时则不会触发.
• mouseout和mouseleave的区别：
• mouseout:鼠标指针离开被选元素时触发,如果鼠标 指针在其被选元素的子元素上来回离开也会触发.
• mouseleave::鼠标指针离开被选元素时触发,如果鼠标 指针在其被选元素的子元素上来回离开则不会触发.

二、键盘事件

方法	执行时机
keydown()	按下按键时
keyup()	释放按键时
keypress()	产生可打印的字符时

三、绑定事件

1.绑定单个事件

$("选择器").bind("事件类型","处理函数");

2.绑定多个事件

$("选择器").bind("事件类型","处理函数","事件类型","处理函数");

四、移除事件

unbind("事件类型","处理函数");

五、复合事件

1.hover()方法

$("选择器").hover(函数1,函数2);

2.toggle()方法:toggle()不带参数时，切换元素的可见状态，如果元素是可见的，则切换为隐藏状态；如果元素是隐藏的，则切换为可见状态。

$("选择器").toggle(函数1,函数2);

六、控制元素显示和隐藏

1.控制元素显示

$("选择器").show("元素从隐藏到显示的速度","元素显示完之后要执行的函数");

2.控制元素的隐藏

$("选择器").hide("元素从显示到隐藏的速度","元素隐藏完之后要执行的函数");

七、改变元素透明度

1.控制元素淡入

$("选择器").fadeIn("元素从隐藏到显示的速度","元素显示完之后要执行的函数");

2.控制元素淡出

$("选择器").fadeOut("元素从显示到隐藏的速度","元素隐藏完之后要执行的函数");

八、改变元素高度

1.元素从上向下延伸显示

$("选择器").slideUp("元素从隐藏到显示的速度","元素显示完之后要执行的函数");

2.元素从下到上缩短至隐藏

$("选择器").slideDown("元素从显示到隐藏的速度","元素隐藏完之后要执行的函数");

九、自定义动画

$("选择器").animate("css属性","效果时长","动画完成后执行的函数");