当HTML页面载入(在<head>部分定义页面载入事件处理程序$(document).ready(function))完成后,
如果打算为元素设定对应的事件处理程序方法,除了可以通过元素直接调用对应的事件处理方法(如:
$("button").click(function(){});)外,还可以使用bind()、one()和live()方法来匹配元素进行特定事件的绑定。
jQuery还提供了unbind()方法用于对自身内部的事件取消绑定,就是使用Event对象来取消绑定事件
处理程序,语法结构为:
$(selector).unbind(eventObj)
其中:参数eventObj是一个Event对象,用于保存触发的事件对象。
示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery中的事件移除</title>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$().ready(function(){
var x=0;
$("p").click(function(evenObj){
$(this).animate({fontSize:"+=5px"});
x++;
if(x >= 2){
$(this).unbind(evenObj);
}
});
});
</script>
</head>
<body>
<p style="font-size:20px;">单机这个段落可以增加其大小。只能增加两次</p>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery中的事件移除</title>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$().ready(function(){
var x=0;
$("p").click(function(evenObj){
$(this).animate({fontSize:"+=5px"});
x++;
if(x >= 2){
$(this).unbind(evenObj);
}
});
});
</script>
</head>
<body>
<p style="font-size:20px;">单机这个段落可以增加其大小。只能增加两次</p>
</body>
</html>