Skip to content
Advertisement

The best way to bind event on a cell element

I’ve a web page fulfilled by a JS script that creates a lot of HTML tables.

Number of <table> created can vary between 1 and 1000 with 100 cells in each of it.

My question is : how to bind efficiently the click on theses tables? Should I bind the click on each cell of the <table> or directly to the <table> itself and retrieve the cell clicked in the bind function?

Or have you another idea?

P.S: I’m using IE6+

Advertisement

Answer

I suggest you use delegate.

$("table").delegate("td", "click", function(){
    alert($(this).text()); // alert td's text.
});

delegate will just bind one event, and that is to the context(in this example, the <table>).

Advertisement