Jquery Namespace Your Events
来源:互联网 发布:如何查询淘宝被降权 编辑:程序博客网 时间:2024/06/16 01:43
Namespace Your Events
A common pattern in jQuery plugin development is the need to undo what the plugin has done. This is usually handled through a method prefixed with "un". Another common pattern is the use of anonymous functions for event handlers. Unbinding events is easy with jQuery but unbinding a single event handler requires the use of a named function. jQuery 1.2 now provides another option for binding and unbinding events: event namespaces.
A Plugin
As a very simple example, let's say I wrote a plugin called "clicked". It provides two methods:clicked
and unclicked
. The clicked
method attaches an event to all matched elements that when clicked adds a class name of "clicked" to the clicked element. Theunclicked
method removes the "clicked" classes it might have set and theclicked
event handlers it attached. Here is the code:
(function($){ $.fn.extend({ clicked: function() { return this.bind('click', function() { $(this).addClass('clicked'); }); }, unclicked: function() { retun this.removeClass('clicked').unbind('click'); } });})(jQuery);
And if you wanted to stop using the plugin, you could just call unclicked
:
So far, so good.
A Problem
But let's say I'm also using another plugin that attaches a click event to the same elements that the clicked plugin does. Callingunclicked
would unbind all the click events, including those bound by your own code or another plugin.
A Solution: Event Namespacing
Event namespacing provides a way to manage specific event handlers. For example, a plugin could namespace its event handlers to make them easier to unbind while still using anonymous functions. To namespace an event, just suffix the event type with a period and a name ("type.namespace
").
Here is the clicked plugin again, but this time using event namespaces:
(function($){ $.fn.extend({ clicked: function() { return this.bind('click.clicked', function() { $(this).addClass('clicked'); }); }, unclicked: function() { retun this.removeClass('clicked').unbind('click.clicked'); } });})(jQuery);
Now it only unbinds the events that it bound in the first place, leaving any other bound events alone.
- Jquery Namespace Your Events
- Namespace Your Events
- jQuery - Events - hover
- jQuery 入门教程(4): Events
- jQuery 入门教程(3): Events
- jQuery 入门教程(4): Events
- Jquery事件(Events)介绍
- JQuery Learning(4):JQuery events
- jQuery - Events事件 - click单击
- EVENTS
- Events
- jQuery - Events遍历器 - submit提交
- 关于jquery easy ui Properties Events Methods
- Write Your Own jQuery Selectors
- jquery源码探索之----事件系统Events(一)
- jQuery find events handlers registered with an object
- How to Hook the Mouse to Catch Events Outside of your application
- NAMESPACE
- getchar、scanf以及缓冲区的概念
- tomcat插件下载地址
- 程序员面试100题之十二:求数组中最长递增子序列
- 技巧:Linux I/O重定向的一些小技巧
- Fedora 15升级内核至3.0.4
- Jquery Namespace Your Events
- 程序员面试100题之十一:数组循环移位
- 通过android应用获得google auth sub token
- C#小数点格式化
- 发现live555中一个小bug
- HTML+CSS网页设计指南
- 程序员面试100题之八:不要被阶乘吓倒
- OpenGL投影变换函数gluOrtho2D()和视口变换函数glViewport()
- 点不然的守望