Utiliser jQuery pour voir si un div a un enfant avec une certaine classe

114

J'ai un div #popupqui est rempli dynamiquement de plusieurs paragraphes avec la classe .filled-text. J'essaie de faire en sorte que jQuery me dise s'il #popupcontient l'un de ces paragraphes.

J'ai ce code:

$("#text-field").keydown(function(event) {
    if($('#popup').has('p.filled-text')) {
        console.log("Found");
     }
});

Aucune suggestion?

javascript jquery

— Samsquanch
source

1

Cherchez-vous uniquement un enfant ou un descendant (enfant, petit-enfant, arrière petit-enfant, etc.). Le titre de la question dit actuellement "enfant" mais les réponses semblent parler de descendants arbitraires.

— hippietrail

À l'époque, je crois que je cherchais spécifiquement un enfant, mais c'est difficile à retenir car cette question a presque 4 ans. Quoi qu'il en soit, la question et la réponse couvrent à la fois les enfants et les descendants, et il y a aussi des réponses qui couvrent spécifiquement les enfants et non les descendants, donc je ne suis pas sûr de ce que vous essayez d'en venir.

— Samsquanch

Oh, c'est juste que lorsque vous utilisez un moteur de recherche pour rechercher une question spécifiquement sur la recherche d'un élément avec un enfant correspondant à un sélecteur, c'est celui qu'il trouve.J'aurais donc modifié le titre de la question s'il était inexact pour aider d'autres personnes à trouver la bonne question à l'avenir.

— hippietrail

197

Vous pouvez utiliser la fonction de recherche :

if($('#popup').find('p.filled-text').length !== 0)
   // Do Stuff

— Tejs
source

7

Cela a fonctionné comme j'en avais besoin, mais pour référence if($('#popup').has('p.filled-text').length != 0) {fonctionne également.

— Samsquanch

9

Pas besoin de vérifier 0. 0 est un faux dans js. developer.mozilla.org/en-US/docs/Glossary/Falsy

— РАВИ

37

Il existe une fonction hasClass

if($('#popup p').hasClass('filled-text'))

— MattP
source

7

Utilisez la fonction enfants de jQuery.

$("#text-field").keydown(function(event) {
    if($('#popup').children('p.filled-text').length > 0) {
        console.log("Found");
     }
});

$.children('').length renverra le nombre d'éléments enfants qui correspondent au sélecteur.

— Christopher Ramírez
source

1

.size()renvoie la même chose que la .lengthpropriété mais est plus lente, vous devez donc la remplacer.

— Johannes Klauß

Merci Johnnes de me l'avoir signalé! Je ne le savais pas. Answare mis à jour!

— Christopher Ramírez

De rien, mais il y a toujours une erreur. Ce n'est .lengthpas.length()

— Johannes Klauß

: PI pensait que c'était une fonction comme la plupart des interfaces jQuery. Une sorte d'incohérence je pense. Mais bon, answare mis à jour une fois de plus: P Merci Johannes.

— Christopher Ramírez

La .lengthpropriété ne fait pas partie de la bibliothèque jQuery, c'est juste du javascript natif. Mais oui, cela peut parfois être déroutant.

— Johannes Klauß

4

Manière simple

if ($('#text-field > p.filled-text').length != 0)

— Hitesh Modha
source

2

La méthode .size () est fonctionnellement équivalente à la propriété .length; cependant, la propriété .length est préférée car elle n'a pas la surcharge d'un appel de fonction.

— Hitesh Modha

1

S'il s'agit d'un enfant direct, vous pouvez faire comme ci-dessous s'il peut être imbriqué plus profondément, supprimez le>

$("#text-field").keydown(function(event) {
    if($('#popup>p.filled-text').length !== 0) {
        console.log("Found");
     }
});

— Rune FS
source