web-dev-qa-db-fra.com

jquery e.target.hasClass ne fonctionne pas

Je crée dynamiquement un nouveau div (avec une classe "textbox" et un ID), et quelques autres éléments à l'intérieur, et plus tard dans mon code je lie ce div à l'événement click, et afficher l'élément cliqué, comme ceci:

$('#textbox_'+i).bind('click', function(event){
    alert(event.target.className);
}

C'est très bien, et cela me donnera textbox comme l'une des classes affichées. Mais event.target.hasClass() ne semble pas fonctionner. Donc, quand je fais ce qui suit, rien ne se passe:

$('#textbox_'+i).bind('click', function(event){
    if(event.target.hasClass('textbox')) { alert('got it!'); }
}

Je l'ai essayé de différentes manières et il me semble que event.target.hasClass() ne fonctionne tout simplement pas. Y a-t-il une autre façon de gérer les événements ou est-ce que je fais quelque chose de mal?

jqueryeventsonclickclassname
42
user961627

Vous essayez d'utiliser une méthode jQuery, hasClass(), sur un élément DOM standard. Vous devez convertir l'élément DOM JS ordinaire e.target En un objet jQuery, comme ceci:

$(event.target).hasClass('textbox')

Et vous vous retrouvez avec:

$('#textbox_'+i).on('click', function(event){
     if( $(event.target).hasClass('textbox')) alert('got it!');
});

Remarquez l'utilisation de on(), la fermeture correcte de la fonction click, et vous n'avez pas besoin de crochets dans votre instruction if si vous exécutez uniquement une alerte simple.

86
adeneo

Si vous souhaitez continuer à utiliser votre élément JS DOM sans utiliser jQuery:

event.target.classList.contains('textbox')
23
iarroyo