To the "event planner" and "live wire" sections, I would also add a section on using .delegate(). The delegate() event binding utility creates fewer and more efficient listeners.
Without researching the technicalities, let's imagine (whether fully accurate or not) that .live just uses the body element as the listener. The difference with .delegate is that you need to specify a listener that will check for events on a matching selector within that listener.
$('td').live("click", handler); // the example
becomes
$('#wrapper').delegate('td', 'click', handler);
Where #wrapper is the closest common ancestor of the TDs in question. You also need to pick an ancestor that isn't going to be destroyed during other DOM manipulation (for example, using '.dataTable_wrapper table' is not a good choice because many uses of DT involve destroying and replacing the table).
This comment has been removed by a blog administrator.
ReplyDeleteThis comment has been removed by a blog administrator.
ReplyDeleteTo the "event planner" and "live wire" sections, I would also add a section on using .delegate(). The delegate() event binding utility creates fewer and more efficient listeners.
ReplyDeleteWithout researching the technicalities, let's imagine (whether fully accurate or not) that .live just uses the body element as the listener. The difference with .delegate is that you need to specify a listener that will check for events on a matching selector within that listener.
$('td').live("click", handler); // the example
becomes
$('#wrapper').delegate('td', 'click', handler);
Where #wrapper is the closest common ancestor of the TDs in question. You also need to pick an ancestor that isn't going to be destroyed during other DOM manipulation (for example, using '.dataTable_wrapper table' is not a good choice because many uses of DT involve destroying and replacing the table).