jQuery事件处理
一、 事件处理
1) bind(type,[data],fn):为每个匹配的元素指定对应的事件处理函数
$(function(){ //绑定多事件 $("#foo").bind("mouseenter mouseleave",function(){
$(this).toggleClass("backS");
}); }); |
2)one(type,[data],fn):为匹配的元素指定一次性事件,执行完成后自动删除
3)trigger(): 一般用来触发页面加载完成后的时间,同时可以和bind配合使用,进行自定义事件的触发
$("div").bind("me", function(){ alert($(this).text()); }); $("div").bind("mouseover", function(){ $("div").trigger("me"); });
|
4)triggerHandler():一般在执行完触发事件后,不会再执行浏览器本身的事件
$(function() { $("input").focus(function(){ $("<span>单击一次</span>").appendTo("body");
}); $("#dd").click(function(){
$("input").triggerHandler("focus");//区别在与不会触发页面上的本身的事件 //$("input").trigger("focus"); });
}); |
事件委派
二、 事件切换
1) hover():一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法
$(function(){ $(".clickme").bind("click",function(){ alert("Live Trigger"); });
$("body").append("<div class='clickme'>Another target</div>"); });
|
三、 事件
1) 鼠标事件
a) Click:用户单击事件(如果右键同时按下,则不发生)
b) dbclick:用户双击鼠标左键
c) mousedown:用户点击任意一个按钮时发生
d) mouseup:用户松开鼠标任何一个按钮时发生
e) mouseover:鼠标移动到一个元素的上方
f) mouseout:鼠标离开一个元素上方的时候发生
2) 键盘事件
a) Keydown:用户在键盘上按下某个按钮
b) Keyup:松开
c) Keypress:用户在键盘按下一个可以产生字符的按钮时发生的
3) Html事件
a) focus()
b) blur()
c) load():页面加载完毕时候,在window对象上触发
d) change:文本框内容发生变化等
e) select:元素的内容被选中时触发的事件
f) submit:
g) reset
h) scroll:用户移动浏览器滚动条