jquery .find() nicht in der Klasse zu finden

Question

Ich habe einen Teil meines HTML-Code, der wie folgt lautet:

<div id="photo-list-container" class="row"> 
      <div class="col-xs-4 col-md-3"> 
        <div class="photo-gallery-holder mar-2x" data-toggle="modal" data-target=".bs-example-modal-lg" data-id="{{ $photo->id }}" data-photo-filename="{{ $photo->id }}" data-tags="{{ htmlspecialchars(json_encode($photo->tags)) }}"> 
         <img class="img-responsive" src="{{ $photo->thumb_url }}" alt="{{ $photo->title }}" /> 
        </div> 
      </div> 
    </div> 

und ich habe versucht, mit Jquery zu tun:

$('#photo-list-container').find('.photo-gallery-holder').each(function() { 
... 
}); 

OR 

$('#photo-list-container .photo-gallery-holder').each(function() { 

Und es wird immer nicht gefunden. Warum das? Das div, nach dem gesucht wird, ist im Fotolisten-Container verschachtelt, oder?

Bitte helfen. Vielen Dank.

Answer 1

$('#photo-list-container').find('#photo-list-container') wird innerhalb #photo-list-container für #photo-list-container aussehen. Und es wird nichts zu finden geben.

Daneben sollte ein id immer eindeutig sein. Es besteht also keine Notwendigkeit für find oder each in jedem Fall.

Wenn Sie alle .photo-gallery-holder innerhalb der Eltern #photo-list-container finden möchten, können Sie find verwenden. Aber ich würde lieber einen direkten Selektor benutzen.

$('#photo-list-container').find('.photo-gallery-holder').each(function() { 
    // ... 
}); 

// or better 
$('#photo-list-container .photo-gallery-holder').each(function() { 
    // ... 
}); 

Answer 2

Sie # verwendet haben, ist es für id-Selektor Sie haben wie als

$('#photo-list-container').find('.photo-gallery-holder').each(function() { 
... 
}); 

oder

$('#photo-list-container .photo-gallery-holder').each(function() { 
    ... 
}); 

Answer 3

die Linienänderung unter . für Klassenauswahl etwas verwenden $('#photo-list-container').find('#photo-list-container').each(function() { zu $('#photo-list-container').find('.photo-list-container').each(function() {

das heißt, Ändern "#" zu "."

# zeigt Element von ID

und .(dot) zeigt an Targeting von Klassennamen

finden mehr jQuery Selektoren auf diesen Link http://www.w3schools.com/jquery/jquery_ref_selectors.asp

Beitrag bearbeiten

-Targeting $('#photo-list-container .photo-list-container').each(function() {

Kontrolle der Geige https://jsfiddle.net/8fn13f75/

Answer 4

Sie müssen nur Klasse hinzufügen mit Id Element wie unten. Es wird die erste Element mit der Id findet und dann für die Klasse sucht und findet passendes Element von HTML

$('#photo-list-container .photo-gallery-holder').each(function(a,b) { 
     ..... 
});