Używanie jQuery do sprawdzania, czy element div ma dziecko z określoną klasą

114

Mam div, #popupktóry jest dynamicznie wypełniany kilkoma akapitami z klasą .filled-text. Próbuję sprawić, by jQuery powiedział mi, czy #popupzawiera jeden z tych akapitów.

Mam ten kod:

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

Jakieś sugestie?

javascript jquery Samsquanch
źródło
1
Szukasz tylko dziecka lub potomka (dziecko, wnuk, prawnuk itp.). Tytuł pytania obecnie mówi „dziecko”, ale odpowiedzi wydają się mówić o arbitralnych potomkach.
hippietrail
Wydaje mi się, że wtedy konkretnie szukałem dziecka, ale trudno to zapamiętać, ponieważ to pytanie ma prawie 4 lata. Tak czy inaczej, pytanie i odpowiedź dotyczą zarówno dzieci, jak i potomków, a są też odpowiedzi, które dotyczą konkretnie dzieci, a nie potomków, więc nie jestem pewien, do czego próbujesz dotrzeć.
Samsquanch
Och, chodzi o to, że podczas wyszukiwania w wyszukiwarce pytania konkretnie o szukanie elementu z dzieckiem pasującym do selektora jest to ten, który znajduje, więc poprawiłbym tytuł pytania, gdyby był niedokładny, aby pomóc innym osobom znaleźć właściwe pytanie w przyszłości.
hippietrail

Odpowiedzi:

197

Możesz użyć funkcji wyszukiwania :

if($('#popup').find('p.filled-text').length !== 0)
   // Do Stuff
Tejs
źródło
7
To faktycznie działało tak, jak tego potrzebowałem, ale w celach informacyjnych if($('#popup').has('p.filled-text').length != 0) {również działa.
Samsquanch
9
Nie ma potrzeby sprawdzania 0. 0 to błąd w js. developer.mozilla.org/en-US/docs/Glossary/Falsy
РАВИ
37

Istnieje funkcja hasClass

if($('#popup p').hasClass('filled-text'))
MattP
źródło
7

Użyj funkcji dzieci jQuery.

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

$.children('').length zwróci liczbę elementów potomnych, które pasują do selektora.

Christopher Ramírez
źródło
1
.size()zwraca to samo, co .lengthwłaściwość, ale jest wolniejsze, więc należy to zastąpić.
Johannes Klauß
Dzięki Johnnes za wskazanie mi tego! Nie wiedziałem tego. Zaktualizowano Answare!
Christopher Ramírez
Nie ma za co, ale nadal jest błąd. To .lengthnie jest.length()
Johannes Klauß
: PI pomyślał, że to funkcja podobna do większości interfejsów jQuery. Myślę, że to rodzaj niekonsekwencji. Ale cóż, answare został ponownie zaktualizowany: P Dzięki Johannes.
Christopher Ramírez
.lengthNieruchomość nie jest częścią biblioteki jQuery, to tylko rodzimy JavaScript. Ale tak, czasami może to być mylące.
Johannes Klauß
4

Prosta droga

if ($('#text-field > p.filled-text').length != 0)
Hitesh Modha
źródło
2
Metoda .size () jest funkcjonalnym odpowiednikiem właściwości .length; jednak właściwość .length jest preferowana, ponieważ nie ma narzutu wywołania funkcji.
Hitesh Modha
1

Jeśli jest to bezpośrednie dziecko, możesz zrobić jak poniżej, jeśli można je zagnieździć głębiej, usuń>

$("#text-field").keydown(function(event) {
    if($('#popup>p.filled-text').length !== 0) {
        console.log("Found");
     }
});
Rune FS
źródło