JS - Jquery Auswahl ist verwirrend

Question

Ich dachte viel über eine bessere Schlagzeile nach, aber ... yeah irgendwie kam niemand, der mein Problem beschreibt.

Ich habe den folgenden Code:

<div id="chatrooms"> 
    <div class="chatroom active" id="all">all</div> 
    <div class="chatroom" id="245332"></div> 
</div> 

Bitte beachte, dass ich die Klassen „Chatrooms“ und „Chatroom“ verwenden - nicht so verwirrt

$(document).on('click', ".chatroom", function(e){ 
    var id = e.target.id; 
    $('.active').removeClass('active'); 
    $('.chatrooms > .chatroom#' + id).addClass('active'); //doesn't work 
    $('.chatrooms').children('#' + id).addClass('active'); //doesn't work 
    $(this).addClass('active'); //works 
}); 

So nur eine dieser drei Methoden Werke , aber ich brauche mindestens eine, die nicht funktioniert, weil ich mehrere divs außerhalb von ".chatrooms" mit der ID habe. Ich hoffe ihr könnt mir helfen! Vielen Dank für Ihre Zeit!

Answer 1

Wenn ich das richtig gelesen habe, ist chatrooms die ID Ihres DIV, nicht die Klasse. Daher sollte der jQuery-Selektor #chatrooms statt .chatrooms sein.

Answer 2

Sie haben hier ein paar Probleme. Zuerst versuchen Sie, Ihre "Chatrooms" ID mit .chatrooms anzusprechen. jQuery verwendet CSS-Selektoren zum Targeting von Elementen, sodass das korrekte Format für Targeting-IDs #chatrooms lautet.

Weiter Sie verwenden ‚.chatrooms > .chatroom#‘, was bedeutet, „alle Elemente mit dem von chatroom#CLASS Ziel, die direkt sind (erste Ebene) Kinder aller Elemente mit dem CLASS von chatrooms.“

Da Sie keine Elemente mit dem CLASS haben von chatroom#, noch haben Sie alle Elemente mit einem CLASS von chatrooms für Kinder zu kümmern in Ihre Ergebnisse leer sein werden.

Sie können bis auf CSS-Selektoren auf http://www.w3schools.com/cssref/css_selectors.asp oder auf diesem großen Übungsplatz http://flukeout.github.io

Sie sollten dort beginnen und dann kommen Sie wieder zu jQuery bürsten.