Je možné kdekoli získat čistě Javascriptovou funkci pro obsluhu událostí s podobnou funkčností jako live()
jQuery ? Potřebuji mít možnost připojovat události k dosud nevytvořeným objektům, ale zdroje jquery-livequery i jquery-events nejsou užitečné kvůli závislosti na jádru jQuery.
Odpověď
Delegování akce je poměrně jednoduché. Vezměte si tento příklad:
Označení:
<div id="container"> <p>Test</p> <p>Test</p> <p>Test</p> </div> <button id="add">Add new paragraph</button>
Scénář:
document.getElementById("container").onclick = function(e) { // e.target is the target of the event or "source element" alert(e.target.innerHTML); }; // dynamically adds new paragraph on button click document.getElementById("add").onclick = function() { var p = document.createElement("p"); p.innerHTML = "a new paragraph"; document.getElementById("container").appendChild(p); };
Protože je obslužná rutina události připojena k nadřazenému prvku, bude fungovat pro všechny budoucí vložené prvky.
Můžete to zkusit zde.
Užitečná reference:
- http://www.quirksmode.org/js/events_properties.html#target
- http://www.sitepoint.com/javascript-event-delegation-is-easier-than-you-think/