jQuery的事件处理,有方法:
hover(Function, Function)
当鼠标move
over时触发第一个function,当鼠标move out时触发第二个function
样式:
<style>.red{color:#FF0000}</style>
<div
id="a">sdf</div>
$(function(){
$("#a").hover(function(){$(this).addClass("red");},
function(){ $(this).removeClass("red");
});
})
toggle
当匹配元素第一次被点击时触发第一个函数,当第二次被点击时触发第二个函数
样式:
<style>.red{color:#FF0000}</style>
<div
id="a">sdf</div>
$(function(){
$("#a"). toggle
(function(){$(this).addClass("red");},
function(){ $(this).removeClass("red");
});
})
另外jQuery的事件处理还有:
bind(type, fn)是用户将一个事件和触发事件的方式绑定到匹配对象上。
trigger(type)是用户触发type形式的事件。$("p").trigger("click")
以及unbind();unbind(type);unbind(type, fn)等
Dynamic event(Function)
绑定和取消绑定提供函数的简捷方式
例:
$("#a").bind("click",function() {
$(this).addClass("red");
})
$("#a").click(function() {
$(this).addClass("red");
});
jQuery提供的函数有以下
- 用于browers事件:
- error(fn)
- load(fn)
- unload(fn)
- resize(fn)
- scroll(fn)
- error(fn)
- 用于form事件
- change(fn)
- select(fn)
- submit(fn)
- change(fn)
- 用于keyboard事件
- keydown(fn)
- keypress(fn)
- keyup(fn)
- keydown(fn)
- 用于mouse事件
- click(fn)
- dblclick(fn)
- mousedown(fn)
- mousemove(fn)
- mouseout(fn)
- mouseover(fn)
- mouseup(fn)
- click(fn)
- 用于UI事件
- blur(fn)
- focus(fn)
- blur(fn)
以上事件的扩展再扩展为5类
比如click(fn);click();unclick();oneclick(fn);unclick(fn)
- click(fn):增加一个点击时触发某函数的事件
- click():可以在其他事件中执行匹配对象的click事件。
- unclick ():不执行匹配对象的click事件。
- oneclick(fn):只增加可以执行一次的click事件。
- unclick
(fn):增加一个点击时不触发某函数的事件。
上面列举的用于browers、form、keyboard、mouse、UI的事件都可以按以上方法扩展。
![]() |
Austin Liu 刘恒辉
Project Manager and Software Designer E-Mail:lzhdim@163.com Blog:https://lzhdim.cnblogs.com 欢迎收藏和转载此博客中的博文,但是请注明出处,给笔者一个与大家交流的空间。谢谢大家。 |