JQuery bind

Posted 2022-04-26 VoidMe

先看手册，由于bind方法有三个参数(type,[data],fn)，所以手册上这么介绍: 
.bind() 方法是用于往文档上附加行为的主要方式。所有javascript事件对象， 比如focus, mouseover, 和 resize，都是可以作为type参数传递进来的。 

任何作为type参数的字符串都是合法的；如果一个字符串不是原生的JavaScript事件名， 那么这个事件处理函数会绑定到一个自定义事件上。这些自定义事件绝对不会由浏览器触发，但可以通过使用.trigger()或 者.triggerHandler()在其他代码中手动触发。 

如果type参数的字符串中包含一个点(.)字符， 那么这个事件就看做是有命名空间的了。这个点字符就用来分隔事件和他的命名空间。举例来说，如果执 行 .bind('click.name', handler) ，那么字符串中的 click 是事件类型，而字符串 name 就是命名空间。命名空 间允许我们取消绑定或者触发一些特定类型的事件，而不用触发别的事件。参考unbind()来获取更多信息。 

当一个事件传到一个元素上，所有绑定在上面的针对哪个事件的处理函数都会触发。如果注册了多个事件 处理函数，总是按照绑定的顺序依次触发。当所有绑定的事件处理函数执行完毕后，事件继续沿着普通的事件冒泡途径上浮。 



jQuery的 bind / unbind 方法应该说使用很简单，而且大多数时候 可能并不会用到，取而代之的是直接用 click / keydown 之类的事件名风格的方法来做事件绑定操作。 

但 假设如下情况：需要在运行时根据用户交互的结果进行不同click事件处理逻辑的绑定，因而理论 上会无数次对某一个事件进行 bind / unbind 操作。但又希望 unbind 的时候只把自己绑上去的处理逻辑给释放掉而不是所有其他地方有 可能的额外的同一事件绑定逻辑。 

这 时候如果直接用 .click() / .bind('click') 加 上 .unbind('click') 来进行重复绑定的话，被 unbind 掉的将是所有绑定在元素上的 click 处理逻辑，潜在会影响到该元素 其他第三方的行为。当然如果在bind的时候是显示定义了function变量的话，可以在unbind的时候提供 function作为第二个参数来指 定只unbind其中一个处理逻辑，但实际应用中很可能会碰到各种进行匿名函数绑定的情况。 

对于这种问题，jQuery的解决方案是使用事件绑定的命名空间。即在事件名称后添 加 .something 来区分自己这部分行为逻辑范围。 

比 如 用 .bind('click.myCustomRoutine',function()...); 同样是把匿名函数绑定到 click 事件（你 可以用自己的命名空间多次绑定不同的行为方法上去），当unbind的时候用 .unbind('click.myCustomRoutine') 即可 释放所有绑定到 .myCustomRoutine 命名空间的 click 事件，而不会解除其他通过 .bind('click') 或另外的命名 空间所绑定的事件行为。 

同时，使用命令空间还可以让你一次性 unbind 所有此命名空间下的自定义事件绑定，通 过 .unbind('.myCustomRoutine') 即可。 

要 注意的是，jQuery的命名空间并不支持多级空间。因为在jQuery里面，如果 用 .unbind('click.myCustomRoutine.myCustomSubone') ，解除的是命名空间分别 为 myCustomRoutine 和 myCustomSubone 的两个并列命名空间下的所有 click 事件，而不 是 "myCustomRoutine 下的 myCustomSubone 子空间"。