欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

jQuery中的事件绑定和去除事件绑定

shiping1 的头像
前天+昨天在折腾本博主题 zSnos-private 的  ajax(jQuery) 加载时碰到一个很郁闷的问题,就是不知道如何去除事件绑定,导致 ajax 请求数成倍增长,囧~

由于没有学过 js ,所以对这些东东不太了解,碰到问题没啥反应,在 Twitter 上请教了 js 高手 Qiqiboy,他说 js 的他会,但 jQuery 的不太了解。于是自己放狗搜……

找到一些资料,特贴此以备忘。

一、用bind()方法来对匹配元素进行特定事件的绑定

在文档装载完成后,使用bind()方法来对匹配元素进行特定事件的绑定,bing() 方法的调用格式为:

bind(type[,data],fn);

3个参数,说明如下

type:blur、focus、load、resize、scroll、unload、click、dblclick、mousedown、mouseup、mousemove、mouseover、mouseout、mouseenter、mouseleaye、change、select、submit、keydown、keypress、keyup和error等,当然也可以是自定义名称。
data是可选参数:作为event.data属性值传递给事件对象的额外数据对象。
fn参数则是用来绑定的处理函数。

例子:点击侧边栏标题显示内容

html代码:

<div id="sidebar">
<h3>标题</h3>
<ul style="display:none"><li>I am zwwooooo.... </li></ul>
</div>

jQuery代码:

$(function(){
$("#sidebar h3").bind("click",function(){
$(this).next().show();
})
});

2010.9.27 ADD:平时我们写像 click、mouseover 和 mouseout 这类事件,因为在程序中经常会使用到,jQuery 为此提供了一套简写方法,如上面的jQuery代码可以写成:

$(function(){
$("#sidebar h3").click(function(){
$(this).next().show();
})
});

其实以前我们写的jQuery代码通常都是用这种简写模式。

二、移除之前的绑定事件

用$("#result").unbind("click")

如果你要移除所有的绑定事件,直接用 $("#result").unbind()

例题中用 $("#sidebar h3").unbind("click")

其实还是不太明白,但知道哪里需要用……好囧的学习方式~

EDIT由于没有系统学习过 js 和 jQuery,此文章的某些说法或许有些问题,有兴趣者请看#4楼Qiqiboy 的评论和自行看jQuery的教程书。

另外:主题 zSnos-private 的 ajax 载入效果全部替换为新的,现在是:底部文章分页导航翻页、分类导航及其分页翻页、侧边栏标签云、侧边栏分月存档、评论翻页都是 ajax 加载,荒淫测试!!!

来自 http://zww.me/archives/25310

 

jQuery 事件 - unbind() 方法

实例

移除所有 p 元素的事件处理器:

$("button").click(function(){
  $("p").unbind();
});

亲自试一试

定义和用法

unbind() 方法移除被选元素的事件处理程序。

该方法能够移除所有的或被选的事件处理程序,或者当事件发生时终止指定函数的运行。

ubind() 适用于任何通过 jQuery 附加的事件处理程序。

取消绑定元素的事件处理程序和函数

规定从指定元素上删除的一个或多个事件处理程序。

如果没有规定参数,unbind() 方法会删除指定元素的所有事件处理程序。

语法

$(selector).unbind(event,function)

亲自试一试

参数描述
event

可选。规定删除元素的一个或多个事件

由空格分隔多个事件值。

如果只规定了该参数,则会删除绑定到指定事件的所有函数。

function可选。规定从元素的指定事件取消绑定的函数名。

使用 Event 对象来取消绑定事件处理程序

规定要删除的事件对象。用于对自身内部的事件取消绑定(比如当事件已被触发一定次数之后,删除事件处理程序)。

如果未规定参数,则 unbind() 方法会删除指定元素的所有事件处理程序。

语法

$(selector).unbind(eventObj)

亲自试一试

参数描述
eventObj可选。规定要使用的事件对象。这个 eventObj 参数来自事件绑定函数。

亲自试一试 - 实例

取消绑定特定的函数
如何使用 unbind() 方法取消绑定元素指定事件的具体函数。


来自 http://www.w3school.com.cn/jquery/event_unbind.asp

普通分类: