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

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