JQuery中的bind()和unbind()的理解

bind()和unbind()提供了事件的绑定和取消机制,既可以绑定html默认支持的事件,也能够绑定自定义事件。

1 、 JQuery中事假可以重复绑定, 不会覆盖

当点击button1的时候,这2个事件处理函数都会触发。上面绑定的是不同的匿名函数,占用不同的内存空间。就算是同一个处理函数,依然存在重复绑定问题。当button1被点击的时候,上面的事件处理函数同样会被调用2次。

2 、 使用bind一次绑定多个事件和处理函数

如果多个事件需要注册相同的处理函数,那么可以使用如下代码进行简化(事件名称使用使用空格分隔):

如果每个事件的处理函数不同,那么可以使用如下的方式(json对象)

3 、  事件取消的三种形式

unbind用来取消之前通过bind绑定的事件处理函数,总的来说有三种形式:取消所有事件、取消某种类型的事件、取消某种类型下的某个事件处理函数。

$("#button1").unbind():取消button1上所有已经绑定的事件处理函数。$("#button1").unbind("click"):只取消button1上绑定的click类型的事件处理函数。

虽然bind和unbind是用的匿名函数功能是相同的,但是这两个函数不是同一个javascript对象,因为它们占用不同的内存空间。可以看到这种做法非常不好,因为这种做法不允许使用匿名函数,我们不得不暴露全局的函数(至少要求unbind的时候能够看得见)。JQuery提供了事件命名空间机制

4 、事件命名空间

所谓事件命名空间, 其实就是事件类型后面以点语法附加一个别名,以便引用事件,如"click.a",其中"a"就是click当前事件类型的别名,既事件命名空间。


使用命名空间,能够以一种更优雅方式取消某种事件类型下的某个事件处理函数。用了命名空间与unbind并不冲突, 上面三种形式的unbind依然可以正常使用。$("#button1").unbind()依然可以取消button1上的所有事件,$("#button1").unbind("click")依然可以取消所有的click事件。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • JavaScript和HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的。 jQuery增加并扩...
    DHFE阅读 691评论 0 1
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,276评论 0 1
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,510评论 0 2
  • 1、 jQuery 能做什么? jquery是一个丰富的js库,内部对js的很多复杂的方法进行了封装和加工,比如j...
    zh_yang阅读 1,513评论 6 13
  • 如果你想改变世界,就去爱一个女人,真正地爱她。 找到呼唤你灵魂的、你用理性无法明白的那一位。 扔掉你的条件清单,耳...
    星星的语言阅读 1,180评论 0 2

友情链接更多精彩内容