2010-04-19 36 views
8

Ich versuche, jQuery zu verwenden, um die Anzahl der Divs zu finden, die beide sichtbar sind, und eine Hintergrundfarbe von Grün haben.Verwenden Sie jQuery, um div von Hintergrundfarbe zu finden

(Normalerweise würde ich nur eine Klasse zum div hinzufügen, style es grün, und überprüfen Sie für diese Klasse in jQuery aber in diesem Fall kann ich nicht wirklich das Markup der Seite selbst in irgendeiner Weise ändern)

ich das sichtbare div Teil arbeiten, wie sie derzeit haben:

if( // if there are more than one visible div 
    $('div.progressContainer:visible').length > 0 
){ 

ich eine Art „und die Farbe ist Hintergrund grün“ werfen möchte Wähler dort.

// not legit javascript 
if( // if there are more than one visible div, and its color is green 
    $('div.progressContainer:visible[background-color:green]').length > 0 
){ 

Ist es möglich, dies zu tun?

Antwort

6

Wenn Sie diese verwenden, in mehr als einem Ort häufig konnte man auch prüfen, Ihre eigenen Selektor (http://answers.oreilly.com/topic/1055-creating-a-custom-filter-selector-with-jquery/)

jQuery.expr[':'].greenbg = function(elem) { 
     return jQuery(elem).css('background-color') === 'green'; 
}; 
Schreiben

Dann würden Sie einfach tun $('div:visible:greenbg').stuffs()

+0

Wie @SLaks darauf hingewiesen, wird dies nicht übereinstimmen # 0f0, sondern bietet einen einzigen Platz für Sie, all diese Prüfungen einzuschließen. –

11

jQuery verfügt nicht über style-basierte Selektoren (außer :visible), so dass Sie das nicht tun können.

können Sie filter verwenden statt:

$('div.progressContainer:visible').filter(function() { 
    return $(this).css('background-color') === 'green'; 
}) 

Beachten Sie, dass es nicht background-color:#0F0 übereinstimmen.

0

Sie dies tun könnte:

if($('div.progressContainer:visible').css('background-color') == 'green'){ 
    //should equal true, if it's green 
} 
3

Sie filter zur Feinabstimmung verwenden können, was du so bist Auswahl:

$('div.progressContainer:visible').filter(function(){ 
    return $(this).css('background-color') == 'green'; 
}); 
Verwandte Themen