完善的jq事件处理功能

Jquery已经为我们提供了各种事件处理方法,我们无需在html元素上直接写事件,而可以直接为通过jquery获取的对象添加事件。 
如: 
$("#msg").click(function(){alert("good")}) //为元素添加了单击事件 
$("p").click(function(i){this.style.color=['#f00','#0f0','#00f'][i]}) 
//为三个不同的p元素单击事件分别设定不同的处理 
jQuery中几个自定义的事件: 
(1)hover(fn1,fn2):一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法。当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。 
//当鼠标放在表格的某行上时将class置为over,离开时置为out。 
$("tr").hover(function(){ 
$(this).addClass("over"); 
}, 
function(){ 
$(this).addClass("out"); 
}); 
(2)ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。 
$(document).ready(function(){alert("Load Success")}) 
//页面加载完毕提示“Load Success”,不同于onload事件,onload需要页面内容加载完毕(图片等),而ready只要页面html代码下载完毕即触发。与$(fn)等价 
(3)toggle(evenFn,oddFn): 每次点击时切换要调用的函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮番调用。 
//每次点击时轮换添加和删除名为selected的class。 
$("p").toggle(function(){ 
$(this).addClass("selected"); 
},function(){ 
$(this).removeClass("selected"); 
}); 
(4)trigger(eventtype): 在每一个匹配的元素上触发某类事件。 
例如: 
$("p").trigger("click"); //触发所有p元素的click事件 
(5)bind(eventtype,fn),unbind(eventtype): 事件的绑定与反绑定 
从每一个匹配的元素中(添加)删除绑定的事件。 
例如: 
$("p").bind("click", function(){alert($(this).text());}); //为每个p元素添加单击事件 
$("p").unbind(); //删除所有p元素上的所有事件 
$("p").unbind("click") //删除所有p元素上的单击事件 
 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

菜鸟也能逆袭

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值