jQuery事件(四)
一、基本事件函数
下面事件函数中参数相关说明:
eventType:事件类型,字符串'click' 'submit'多个事件类型可以通过用空格隔开【一次性绑定'click submit'】
eventData:事件数据,一个对象
handler:事件处理函数
eventObjec:事件对象
data:传递给事件处理函数handler的额外数据
bind(eventType,[eventData ],handler(eventObject)) 【事件绑定】
同时绑定多个事件类型/处理程序
eg:
$("button").bind({ click:function(){$("p").slideToggle();}, //点击按钮对p标签进行滑动显示隐藏 mouseover:function(){$("div").css("background-color","red");} //鼠标移入按钮时设置匹配div的背景颜色为红色 });
unbind([eventType],[handler(eventObject)]) 【事件解绑】
a、无参时,.unbind() 将移除指定元素上所有绑定的处理程序
b、参数为某事件类型时,移除该事件类型上的所有绑定的处理程序
c、参数为事件类型,事件处理函数时,移除该事件类型上绑定的该处理函数【处理函数在绑定时需单独定义出来赋予函数名】
on( events,[selector],[data],handler(eventObject)) 【绑定一个或多个事件;(类似事件代理)】
a、有selector参数时,表示只能添加事件到指定元素的selector选择的后代元素上【函数内的事件对象target,currentTarget和this均为selector选中的元素】
b、无selector参数时,表示给指定元素绑定相应的events事件
off( events,[selector],[handler]) 【解除on上面绑定的一个或多个事件】
与上面的unbind()函数类似,用于解除on()方法绑定的事件
trigger( eventType,[extraParams]) 【模拟事件执行,即让事件自动触发执行】
根据绑定到匹配元素的给定的事件类型eventType执行该事件处理程序的行为。
extraParams传递给事件处理程序的额外参数,为数组类型。
eg:
$("div").click(function(event,a,b){}).trigger("click", [123, 456]); //模拟div点击事件自动执行并传递两个额外参数给执行函数
二、鼠标事件
click() 鼠标单击事件
dblclick() 鼠标双击事件
hover() 鼠标悬停事件
mousedown() 鼠标按下事件
mouseup() 鼠标抬起事件
mouseenter() 鼠标进入事件【不支持子元素】
mouseleave() 鼠标离开事件【不支持子元素】
mouseout() 鼠标离开事件【支持子元素】
mouseover() 鼠标进入事件【支持子元素】
mousemove() 鼠标移动事件
三、键盘事件 【只简单介绍事件类型】
keypress() 按键按下事件
keyup() 按键抬起事件
keydown() 键按下的过程发生的事件
四、表单事件
focus() 聚焦事件
blur() 失焦事件
change() 元素的值改变时激发的事件
select() 当textarea或文本类型的input元素中的文本被选择时触发的事件,绑定在单行文本框或多行文本框上
submit() 表单提交事件,绑定在form