Plugins

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

event delegation


MenuTree Plugin

This plugin is hosted using the github repository at :
http://github.com/pixelhandler/jQuery-MenuTree-Plugin/

A JavaScript plugin based on jQuery library that builds an expandable/collapsable menu tree from a list element using event delegation

  • Requires JavaScript library: jQuery

  • Developed using jQuery version 1.4 ... Plugin page

  • Demo of the plugin behavior showing both lists and definition list... Demo

  • Status : New plugin, give it a try!

  • Event delegation for Click event binding to tree/list element, instead of binding to each anchor

  • Tracer plugin added and featured with demo.

Event Delegated Drag And Drop Plugin

Binding event listeners to hundreds of elements in order to accomplish drag and drop can be a very slow task. Then, if you add new items to the page or change the page's content after it has initially loaded, you have to add these event handlers to all of the new elements. This plugin solves both of those problems by using jQuery's live events, otherwise known as event delegation. This means that you can make a certain selector draggable or droppable, and add more items to the page. If the new items fall under that selector, they will be come draggable or droppable automatically - with no work on your part! If speed is an important thing to you, use this plugin! The API is very similar to jQuery UI's draggable and droppable plugins.

Extends jQuery´s live-Method to support more event-types

Extends jQuery´s built-in event delegation methods 'live' and 'die' to support mouseenter, mouseleave and change. It also implements focusin and focusout Events (by Jörn Zaefferer), wich can substitue the focus/blur Event and can be used with both the live or the bind method.

//hover with live
$('tr').liveHover(function(e){
console.log('enter')
},
function(e){
console.log('leave')
});
//mouseenter with live
$('tr').live('mouseenter', function(e){
console.log('enter')
});

//change with live
$('input').live('change', function(e){
console.log('changed')
});

Note: The change-Event used with the live-Method is also normalized. It will behave how the change-event in modern browser or how it is specified by the W3C HTML 5 working group. (no more click to notice a change on radiobuttons/checkboxes)

Note the extension also adds support for a kind of bubbling, if you use the bubbleLive-method:

Bond - Dynamic Event Delegation

jQuery Bond is a plugin that automates event delegation while allowing the focus and blur events to bubble, which is a common drawback when delegating events. Bond is also designed to handle elements that haven't been added to the DOM yet - hence delegation.

A method for unbinding is also included