Comments on: Namespace Your Events

By: Randy

Randy — Mon, 21 Nov 2011 12:49:45 +0000

Beautiful! I made a jQuery plugin that makes a DOM element bordered and binds a click event handler that toggles the border color. No worry now about other plugins unbinding my plugin's handler and vice versa.


$.fn.extend({
        clicked: function() {
            this.addClass('clicked off');
            return this.bind('click.clicked', function() { //namespaced handler
                $(this).toggleClass('on off');
            });
        },
        unclicked: function() { //namespaced handler
            return this.removeClass('clicked on off').unbind('click.clicked');
        }
    });

// e.g. $('#border_flasher').clicked(); <-- makes element border flashable
//      $('#border_flasher').unclicked(); <-- safely unbinds handler that .clicked() bound

In CSS I style all the border except the color in the 'clicked' class and the border colors are styled in the 'on' and 'off' classes. Works well so far. I love this site! So much useful info for those on the jQuery learning curve.

By: jQuery 1.7 Beta 1 Released | Code to Preload

jQuery 1.7 Beta 1 Released | Code to Preload — Tue, 11 Oct 2011 04:19:47 +0000

[...] Over time, jQuery has evolved three ways to attach events to elements: .bind() , .live(), and .delegate(). Underneath it all, though, the three event APIs call the browser’s event system; that can lead to surprising interactions. For example, $(document).unbind("click") will remove all .live("click", …) events, since those delegated events are attached to document. (This is also why you should use event namespaces.) [...]

By: jQuery: » jQuery 1.7 Beta 1 Released

jQuery: » jQuery 1.7 Beta 1 Released — Wed, 28 Sep 2011 22:28:39 +0000

By: Ken

Ken — Sat, 06 Feb 2010 13:36:32 +0000

In jQuery 1.3.2 , you can also trigger an "exclusive" event, meaning only non-namespaced events are triggered. You do this by supplying e.g. "click!" as the event name. See my post here

By: Working with Events, part 2 | haojii

Working with Events, part 2 | haojii — Tue, 19 Jan 2010 14:11:47 +0000

[...] 请阅读Brandon Aaron的文章以了解更多关于事件名称空间的知识： Namespace Your Events. [...]

By: Arjun

Arjun — Sat, 26 Sep 2009 08:55:04 +0000

Thanks, that was what I was looking for :)

By: Working with Events, part 2 » Learning jQuery - Tutorials and Information

Working with Events, part 2 » Learning jQuery - Tutorials and Information — Sun, 07 Dec 2008 21:40:32 +0000

[...] For more information about event namespacing, read Brandon Aaron’s article, Namespace Your Events. [...]

By: jQuery Autocomplete Plugin by bigredswitch

jQuery Autocomplete Plugin by bigredswitch — Mon, 10 Nov 2008 00:02:16 +0000

[...] like ‘click.autocomplete’ were. Turns out that jQuery has a mechanism where you can namespace your events. Here is another writeup about it. Nice [...]

By: Karl Swedberg

Karl Swedberg — Tue, 10 Jun 2008 23:27:26 +0000

Hi Nanda, Try something like this:

$('body').bind('click', function(e) {
  if (e.target.nodeName != TEXTAREA) {
    // do something
  }
});

No need for the unbind.

By: Nanda

Nanda — Tue, 10 Jun 2008 04:19:53 +0000

First I would like to congradulate you on this blog and I have found the writeup useful. However I have a problem where I bind a click function to the entire document but then want to unbind for a specific element in this case a textarea so that clicks inside the textarea do not trigger the anonymous function. Could using namespace s solve the problem. I have provided the jQuery code I am using to tdo this below:


entire_document.bind('click', function(e)
	{
		jQuery('#textareaid').unbind('click');
                 if (condition)
                 {
                        // do some stuff
                  }
                 else 
                  {
                         // do some other stuff
                   }
        entire_document.unbind('click');
	});