jquery versteckte Eltern

Question

ummm, wahrscheinlich eine einfache ... der Code unten funktioniert nur mit sichtbaren (show()) Elemente Wie bekomme ich es das erste versteckte Element stattdessen wählen?

JQuery

$(".postSelectedRules").each(function() { 
    $(this).parents("#idruleB-"+$(this).attr("id").substr(8)+":hidden:first").css('background', '#bbbbbb'); 
}); 

Html

<a id="idruleA-1" class="postSelectedRules" href="#">1</a> 
<div class="postStuff"> 
    <div class="postRules"> 
     <span id="idruleB-1" class="postRulesSelect">1</span> 
     <span id="idruleB-2" class="postRulesSelect">2</span> 
    </div> 
</div> 

Answer 1

Ihr Code macht nicht viel Sinn. Sie suchen die Eltern der übereinstimmenden Knoten nach Knoten, die dieselbe ID wie der aktuelle Knoten haben? IDs sollte eindeutig sein.

Wie für versteckte Gegenstände die allgemeine Form ohne wäre so etwas wie:

$(this).parents(":someClass:visible:first").addClass("blah"); 

auch statt:

css('background', '#bbbbbb'); 

würde ich sehr empfehlen Klassen statt, wenn möglich verwenden. Das Hinzufügen und Entfernen von CSS-Attributen ist problematisch. Der Unterricht ist einfach.

Answer 2

Sie können es mit

$(".postSelectedRules:hidden").each(function() { 
    $(this).parents("#"+$(this).attr("id")).css('background', '#bbbbbb'); 
}); 

Die: versteckt im Selektor sucht nach Einträgen, die versteckt sind.

Ich hoffe, dass hilft.

Answer 3

Nur FYI ... Sie sollten nie wiederholte IDs haben. Sie werden feststellen, dass Ihr Code viel schneller ausgeführt wird, wenn Sie dies sicherstellen. Es würde viel mehr Sinn machen, eine Klasse in dieser Situation zu verwenden.

Nehmen wir an, dass Sie XHTML ist wie folgt:

<div class="someClass" style="display:block;" id="someElement_1"> 
    <div class="postSelectedRules"></div> 
</div> 
<div class="someClass" style="display:none;" id="someElement_2"> 
    <div class="postSelectedRules"></div> 
</div> 
<div class="someClass" style="display:none;" id="someElement_3"> 
    <div class="postSelectedRules"></div> 
</div> 

Sie würden dies tun # someElement_3" wählen‘(das erste versteckte Element):

$('.someClass:hidden:first').css({backgroundColor:'#bbb'}); 

Ich glaube, das ist im Grunde, was Sie versuchen