web-dev-qa-db-fra.com

Comparez 'e.target' à un objet jQuery

Ce que je veux faire:

( clickedObject === someDiv ) //returns true or false

Ce que j'ai essayé

( $(e.target) === $('.selector') ); //returns a false negative.

Ma solution de contournement

( $(e.target).attr('class') === $('.selector').attr('class') ); //works as intended, not so clean though.

Quelle est la bonne façon de comparer l'objet sur lequel j'ai cliqué à un objet dans le DOM?

javascriptjqueryjavascript-eventsclick
35
dubbelj

Pour vérifier si e.target a cette classe, vous pouvez utiliser la fonction hasClass.

if ($(e.target).hasClass("selector"))

Ou, si vous voulez vraiment comparer les objets, notez que les sélecteurs jQuery renvoient une collection d’articles, je pense donc que vous voudrez

if (e.target === $('.selector')[0])
37
Adam Rackis

Tu es proche. Utilisez .is() à la place:

if($(e.target).is('.selector')) {
    // Your code
}

Le truc ici consiste à envelopper e.target dans un objet jQuery pour lui permettre d’accéder à toutes les méthodes jQuery utiles.

Si vous voyez seulement si e.target a une certaine classe, essayez d'utiliser .hasClass() à la place de .is():

if($(e.target).hasClass('selector')) {
    // Your code
}

Les deux méthodes fonctionnent, bien que .hasClass() soit un peu plus clair sur ce que fait le code, et est plus rapide que d'utiliser .is()

30
Bojangles

Évidemment, utiliser la fonction .is() est la meilleure solution ici.

Si vous vous trouvez en train de faire une telle comparaison, essayez de vérifier s’il est possible d’utiliser des mécanismes jQuery intégrés comme celui-ci:

$(element).on("click", ".selector", function() {
    alert("clicked");
});

Le deuxième argument de la méthode .on() est un sélecteur de cible. Lors de l'utilisation de cette construction (en savoir plus: http://api.jquery.com/on/#direct-and-delegated-events ), il ne sera pas nécessaire de procéder à des comparaisons supplémentaires.

https://jsfiddle.net/m5zysufy/

0
luke

Si vous voulez faire correspondre l'élément auquel l'événement est attaché, vous pouvez utiliser $(this) ou si vous voulez savoir quel élément a déclenché l'événement, utilisez $(event.target). 

Vous trouverez ci-dessous un exemple des deux.

http://jsfiddle.net/Phunky/TbJef/

À moins que vous n'utilisiez la délégation d'événement, celles-ci seront les mêmes et s'il y a le même élément.

0
Phunky