事件的命名空间

• 场景：页面上的某个元素bind多个click事件处理函数，视用户的具体交互情况来决定到底使用哪个处理函数。
• 问题：
  1. unbind时会解绑所有的click事件，造成误伤。如果之前bind时有定义处理函数的方法名，可以通过将方法名传给unbind的第二个参数来解绑指定的bind；但很多情况下bind的处理函数都是匿名函数，此时unbind的第二个参数无法处理。
  2. click事件发生时无法指定调用某个具体的事件处理函数,只能将不该调用的函数给unbind掉。
• 解决：采用命名空间，命名空间用法

[javascript]  view plain copy

1. <pre name="code" class="javascript"><script type="text/javascript" src="jquery-1.7.1.min.js"></script>  
2. <input type="text" id="test">  
3. <script>  
4. $("#test").bind('click.a',function(){  
5.     alert(1);  
6. });  
7. $("#test").bind('click.b',function(){  
8.     alert(2);  
9. });  
10. $("#test").bind('click.c',function(){  
11.     alert(3);  
12. });  
13. $("#test").unbind('click.a');   //解绑a  
14. $("#test").trigger('click.c');  //弹出3  
15. $("#test").click(); //弹出2、弹出3  
16. </script></pre>  
17. <pre></pre>  
18. <pre></pre>  
19. <pre></pre>  
20. <pre></pre>  

通过事件名(click)后加'.'来指定新的命名，本例中分别指定的新的命名a、b、c，这样在unbind时就可以解绑指定的函数;在trigger时就可以调用指定的函数。很多js扩展功能都采用命名空间来区分出自己的事件和避免与页面原有事件产生冲突。

转载于：http://blog.csdn.net/clangke/article/details/7612224

补充：

1、同时，使用命令空间还可以让你一次性 unbind 所有此命名空间下的事件绑定，通过 .unbind('.myCustomRoutine') 即可。 
2、要注意的是，jQuery的命名空间并不支持多级空间。因为在jQuery里面，如果用 .unbind('click.myCustomRoutine.myCustomSubone') ，解除的是命名空间分别为 myCustomRoutine 和 myCustomSubone 的两个并列命名空间下的所有 click 事件，而不是 "myCustomRoutine 下的 myCustomSubone 子空间"。