For ease of coding, a separate bind method for each element is pretty
straight forward. However when you are dealing with a large number of
elements, and your processing needs to look at those large number of
elements, then performance can get to be a problem.
For instance....
$(".myclass").click( function () { ... });
This looks innocent enough, but if you have hundreds, or even thousands
of elements on the page, then finding all the ".myclass" elements can
take a while. Of course, narrowing down the selector helps -
"div.myclass" for instance.
I found this problem to be especially visible when dealing with a very
dynamic page. (mine was a calendar type application where LOTS of info
via Ajax that would result in updating the calendar and needing to
reapply handlers).
In cases like this, you'll probably be better off applying the click
handler to a container element if possible, then using the event.target
element to look at the element throwing the event.
Oh, and if you need more data for processing than just the ID, don't
forget about the jQuery.data() method....
HTH
Shawn
saqib wrote:
I am developing an application in which I have to define click events
for many elements( the list may go up to hundreds). So what would be
the best way to capture these event
Either using a *
bind( $('*') );
and in click function get the id of target element and code
accordingly
OR use a separate bind method for every element.
$('#elementID').click(function(){
bind( );
});
