Am crezut că a folosi un comportament este ca și cum ai folosi
jQuery(document).ready(funcție ($), deci codul ar fi doar
executat când DOM-ul a fost încărcat complet și nu înțeleg de ce este
fiind chemat pentru cinci contexte diferite.
Nu. Dacă ar fi așa, comportamentele ar fi inutile.
- Comportamentele sunt legate de un singur nod DOM, deoarece în Drupal nu știți când acest nod DOM este redat/injectat în pagină (rețineți BigPipe, Ajax Views, coșuri de cumpărături Ajax etc).
- Comportamentele sunt declanșate prima dată după DOM gata și, potențial, foarte des după aceea, când noi părți parțiale sunt injectate în DOM. Pentru a evita duplicarea ascultătorilor de evenimente pe nodurile preexistente, mai vechi folosesc
o singura data-funcţie.
- The
context doar face mai rapidă dezafectarea și reatașarea comportamentelor, dacă omiteți contextul, orice injecție a unui nod DOM trebuie să caute în întregul document comportamente potențiale și nu doar în contextul parțialului nou injectat.
- Echivalentul lui
$(document).gata() ar fi sunat $(document, context).once() în interiorul unui comportament, deoarece documentul-context este transmis o singură dată.
Codul dvs. de buclă ar arăta astfel:
Drupal.behaviors.myCustomBehavior= {
atașați: funcție (context, setări) {
$('.section-wrapper', context).once('myCustomOnceId').each( function(index) {
$(this).addClass('foo');
});
}
};
Deci, de ex. dacă ale tale <div class="section-wrapper"> se află într-un rând de vizualizare infinită de defilare, fiecare <div> va primi exact unul foo clasa, indiferent când este încărcată.
Continuând exemplul de mai sus cu vizualizarea de defilare infinită și clasa „foo”, după 2 injecții Ajax...
...fără a folosi un comportament, ai ajunge cu ceva de genul
<div class="section-wrapper foo"></div><div class="section-wrapper"></div><div class="section-wrapper"></div>
...folosind un comportament fără o singura data, ai ajunge cu ceva de genul
<div class="section-wrapper foo foo foo"></div><div class="section-wrapper foo foo"></div><div class="section-wrapper foo"></div>
