Thursday, 15 September 2011

performance - How to identify what object triggered the jQuery click event within delegate code -



performance - How to identify what object triggered the jQuery click event within delegate code -

i have simple jsfiddle utilize jquery caching , delegate. how can create handler dynamic plenty when user clicks first grouping checkbox, highlights rows below , when user selects sec grouping checkbox, should select rows below sec checkbox.

i can have n groups , n rows under grouping checkbox. performance, trying cache , in handler want able select desired grouping rows based on checkbox using designated classes identify group. also, want identify when user clicks on info cell.

i tried different options identify object, guess obj.type doesn't homecoming thought give me type. help much appreciated.

code:

var elements = $(".data"); $("table").delegate("td", "click", function(evt){ var obj = $(this); switch (obj.type) { case: "checkbox": //select elements under grouping elements.addclass('blue'); break; case: "td": //i know not right case, not sure how trap cell click //apply class 'red' break; default: elements.addclass('green'); break; } });

supporting html , css

<table> <tbody> <tr> <td> <input type="checkbox" id="chkfirst" /> </td> </tr> <tr class="data"> <td class="first"> </td> </tr> <tr class="data"> <td class="first"> b </td> </tr> <tr class="data"> <td class="first"> c </td> </tr> <tr class="data"> <td> <input type="checkbox" id="chksecond" /> </td> </tr> <tr class="data"> <td class="second"> aa </td> </tr> <tr class="data"> <td class="second"> bb </td> </tr> </tbody> </table> .blue { color: blue; } .red { color: red; } .green { color: green; }

have tried evt.target? should html element triggered click.

try sample jsfiddle illustration. since know cell is, can go dom heirarchy figure out, row or table got clicked.

jquery performance caching jquery-delegate

No comments:

Post a Comment