绑定一次性事件
one()是on()的一个特例,用法与bind()完全相同,但是他绑定的事件在执行一次响应之后就会失效。用法如下:
one(event,[data],dunction)
参数说明如下:
event:必须参数项,添加到元素的一个或多个事件,如click、dblclick等。
data:可选参数项,设计需要传递的参数。
function:必须参数项,当绑定事件发生时,需要执行的函数。
$(function(){
$("ul>li").one("click",function(){
alert($(this).text());
});
})
注销事件
交互性事件的生命周期往往与页面的生命周期是相同的,但是很多交互性事件只有在特定的时间或者条件下有效,超过了时效期,就应该把他注销掉,以节省系统空间。
jQuery提供了四种事件的绑定方式(具体用法在上一博客已经介绍过,有兴趣的小伙伴可以看一下我的上一篇博客):bind()、live()、delegate()、on(),对应的注销事件方式为:unbind()、die()、undelegate()、off()。
注销方法与注册方法是相反的操作,参数和用法基本相同。他们能够从每一个匹配的元素中删除绑定的事件。如果没有指定参数操作,则删除所有的绑定事件,包括注册的自定事件。
在下面的案例中,为p元素标签绑定了dblclick、click、mouseover、mouseout四个事件,当触发双击事件时,会注销掉所有的事件,此时p元素之前的4个事件都将会被注销。
$(function(){
$("p").dblclick(function(){ //注册双击事件
$("p").off(); //注册注销所有事件
});
$("p").click(f); //注册单击事件
$("p").mouseover(f); //注册鼠标移过事件
$("p").mouseout(f); //注册鼠标移出事件
function f(event){ //事件处理函数
this.innerHTML= "事件类型 = " + event.type;
}
})
在下面的代码中,只会注销p元素的mouseover事件,而其他类型的事件依然存在。
$("p").dblclick(function(){ //注册双击事件
$("p").off("mouseover");//注册鼠标移过事件
});
如果将在绑定时传递的处理函数作为第二个参数,则只有这个特定的事件处理函数会被删除。
看下面的代码,为p元素绑定了两个处理函数不同的mouseover事件,但是第二次绑定的事件会覆盖到之前所绑定的事件,因此当划过该元素时,起内容会显示为“第二个点击事件”。当点击该元素后,由于传递了注销函数的第二个参数,因此只会注销掉处理函数为e的mouseover事件。处理函数为f的mouseover事件依然存在
$(function(){
$("p").click(function(){ //注册单击事件
$("p").off("mouseover", e); //注销鼠标经过事件中e()事件处理函数
});
$("p").mouseover(f); //注册鼠标经过事件,绑定f()事件处理函数
$("p").mouseover(e); //注册鼠标经过事件,绑定e()事件处理函数
function f(){
$(this).text("第一个单击事件")
}
function e(){
$(this).text("第二个单击事件")
}
})