页面加载
- ready()方法:实现了类似于window.onload事件的功能,但是写法比较多
1.$(document).ready(function(){});
2.$().ready(function(){});
3.$(function(){});
事件绑定与解绑
- bind(type,data,callback)方法:绑定事件
type:表示绑定的事件名称(注意:没有on)
data:作为event.data属性传递给事件对象的额外数据对象
callback:表示绑定事件的处理函数
$('button').bind('click',function(){});
- unbind(type,data,callback)方法:解绑定事件
type:表示绑定的事件名称(注意:没有on)
data:作为event.data属性传递给事件对象的额外数据对象
callback:表示绑定事件的处理函数
如果只传递事件名称的话,解绑定事件的所有处理函数
如果传递事件名称和指定的处理函数,解绑定该事件的指定处理函数
$('button').unbind('click',函数名称);
bind()与unbind()中的data参数
data参数的值,利用event事件对象的data属性进行接收
该参数的数据内容只能在事件的处理函数中被使用
jQuery中提供多组事件绑定与解绑的方法
1.bind()与unbind():jQuery 3.0版本后删除方法
2.on()与off()方法:jQuery 1.7版本后新增方法
其实bind()与unbind()的底层方法就是on()和off()
3.live()与die():jQuery 1.7版本后删除方法
实现事件委托
4.delegate()与undelegate():jQuery 1.6版本后新增方法,jQuery 3.0版本后删除方法,实现事件委托
5.one():为事件绑定一次性的函数
事件切换
鼠标悬停事件:
1.mouseover:表示鼠标悬停在指定元素上
2.mouseout:表示鼠标从指定元素上移开
jQuery提供hover(over,out)方法,它可以直接实现鼠标悬停和鼠标从元素上移开的功能
$('button').hover(function(){
$('div').css('display','block');
},function(){
$('div').css('display','none');
});
事件模拟
trigger():模拟用户进行触发事件
$('button').bind('click',function(){
console.log('this is button');
});
//模拟用户触发
$('button').trigger('click');
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。