jQuery: Live Query Plugin

Brandon Aaron has written a new jQuery plugin Live Query. Live Query, previously called Behavior, utilizes the power of jQuery selectors by binding events or firing callbacks for matched elements auto-magically, even after the page has been loaded and the DOM updated. For example you could use the following code to bind a click event […]

Share online:

Brandon Aaron has written a new jQuery plugin Live Query. Live Query, previously called Behavior, utilizes the power of jQuery selectors by binding events or firing callbacks for matched elements auto-magically, even after the page has been loaded and the DOM updated.

For example you could use the following code to bind a click event to all A tags, even any A tags you might add via AJAX or a script.

$('a') .livequery('click', function(event) { alert('clicked'); return false; });

Live Query also has the ability to fire a callback function when it matches a new element and another callback function for when an element is no longer matched. This provides ultimate flexibility and untold use-cases. For example the following code uses a function based Live Query to implement the jQuery hover helper method and remove it when the element is no longer matched.

$('li') .livequery(function(){ $(this) .hover(function() { $(this).addClass('hover'); }, function() { $(this).removeClass('hover'); }); }, function() { $(this) .unbind('mouseover') .unbind('mouseout'); });

It may also be included into the core of jQuery v1.2 with more information found in the jQuery roadmap.

Live Query can be downloaded from the Live Query project page or look at the demos in action. The Live Query documentation is a work in progress but the API is fully documented.

Live Query, jQuery, Plugins

About The Author

Deepak Gupta is a IT & Web Consultant. He is the founder and CEO of diTii.com & DIT Technologies, where he’s engaged in providing Technology Consultancy, Design and Development of Desktop, Web and Mobile applications using various tools and softwares. Sign-up for the Email for daily updates. Google+ Profile.