Maison > interface Web > js tutoriel > Explication détaillée de la différence entre utiliser on au lieu de délégué et vivre dans jQuery

Explication détaillée de la différence entre utiliser on au lieu de délégué et vivre dans jQuery

黄舟
Libérer: 2017-06-26 10:04:22
original
1245 Les gens l'ont consulté

Au début, lors de l'attribution de événements ou de valeurs à des éléments dynamiques chargés plus tard sur la page, live était utilisé en raison de sa faible efficacité (en fait, là-bas. il n'y a pas beaucoup de données et cela ne se ressent pas) ), et plus tard, utilisez délégué à la place. Plus tard, après la version 1.7, on est utilisé à la place de délégué. Live et délégué peuvent toujours être utilisés dans la nouvelle version. méthodes d'écriture. Si vous n'écrivez pas pendant un certain temps, il sera facile de vous perdre. Notez-le. Si vous cliquez sur un bouton dans p pour ajouter un nouveau bouton :


<.>

Page :

<div id="panel">   
      <input type="button" name="name"  value="clone"class="btnAdd" />
</div>
Copier après la connexion

Script :

1.1 en utilisant live

jQuery version 1.3+

$(&#39;.btnAdd&#39;).live(&#39;click&#39;, function () {
    $(this).clone().appendTo(&#39;#panel&#39;);
});
Copier après la connexion

1.2 Changer directement live en on, sans donner de portée telle que #panel . Ceci est efficace pour le bouton qui se trouve sur la page au début. Autrement dit, Cela ne peut pas remplacer directement le live

$(&#39;.btnAdd&#39;).on(&#39;click&#39;, function () {    
$(this).clone().appendTo(&#39;#panel&#39;);
});
Copier après la connexion
<. 🎜>


2. Pour utiliser un délégué, vous devez lui donner une portée, telle que #panel, laissez-le trouver à l'intérieur. Cela peut obtenir le même effet qu'en direct.

<🎜. >jQuery version 1.4.3+


$(&#39;#panel&#39;).delegate(&#39;.btnAdd&#39;, &#39;click&#39;, function () {
    $(this).clone().appendTo(&#39;#panel&#39;);
});
Copier après la connexion

3.使用on 给它一个范围才行,如#panel,让它到里面找. 这样可以实现live和delegate一样的效果.

里面的'click', '.btnAdd'跟上面的delegate是相反的.只要记住on click是挨在一起的就行了.

jQuery版本1.7+

$(&#39;#panel&#39;).on(&#39;click&#39;, &#39;.btnAdd&#39;, function () {
    $(this).clone().appendTo(&#39;#panel&#39;);
});
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal