如何使用jQuery檢查css值？

用戶點擊表格行後，我想讓它檢查表格行的背景顏色是否爲白色，如果是，則會將顏色更改爲淺藍色。如何使用jQuery檢查css值？

我正在使用的代碼不起作用。這裏是：

$("#tracker_table tr#master").click(function(){ 
    if($(this).css("background-color") == "#FFFFFF") { 
    $(this).css("background-color", "#C2DAEF"); 
    } 
});

我認爲我的if語句有問題。如何使用jQuery檢查css值？

來源

2010-05-31 zeckdude

你可能想看看這個博客[比較顏色與JavaScript]（http://radio.javaranch.com/pascarello/2005/05） /19/1116513366466.html）。顯然不同的瀏覽器代表不同的顏色，或在2005年。 – R0MANARMY 2010-05-31 03:30:48

看起來它在形式rgb(x, y, z)被退回，所以你的代碼應該是：

$("#tracker_table tr#master").click(function(){ 
    if($(this).css("background-color") == "rgb(255, 255, 255)") { 
    $(this).css("background-color", "#C2DAEF"); 
    } 
});

編輯：話雖這麼說，我建議你使用類，而不是檢查的/直接設置CSS屬性。事情是這樣的：

$("#tracker_table tr#master").click(function(){ 
    if(!$(this).hasClass("selected")) { 
    $(this).addClass("selected"); 
    } 
});

的CSS：

tr { background-color: #FFFFFF; } 
tr.selected { background-color: #C2DAEF; }

來源

2010-05-31 03:30:48 Alconja

這仍然無法正常工作。我的if語句有問題，因爲我試圖在if語句中添加一個警報，並且它從不警告，所以我知道if語句無法正常工作。 – zeckdude 2010-05-31 03:36:01

@zeckdude：你在測試什麼瀏覽器？我看不到任何與if語句有關的問題，並且'rgb（...）'格式至少會在firefox＆webkit中返回，但也許它依賴於瀏覽器，因爲@ R0MANARMY在他對您的評論中建議問題（通常jQuery試圖隱藏這些跨瀏覽器的怪異）雖然你可以嘗試我的第二個建議在上面的編輯。 – Alconja 2010-05-31 03:39:52

雖然這可能工作，實際上你存儲的色彩形式的信息，然後檢索和後來比較這些信息。 Alconja提出了一種可行的方法，但最終你可能會更好地使用類，這些類的名字可以由你定義，以表達適當的含義。這樣做更友好也更脆弱：

$('#tracker_table tr#master').click(function(){ 
    if ($(this).hasClass('something')) { 
     $(this).removeClass('something').addClass('something_else'); 
    } 
})

來源

2010-05-31 03:37:25

這可能是要走的路，我假設這些顏色具有某種意義，如「選定的行」或什麼。 – R0MANARMY 2010-05-31 03:44:11

如果你的項目干係人決定現在不管白色意味着什麼，他們更喜歡它是淺灰色的？不，不是那灰色，另一個灰色。並且讓藍色更綠一些。使用語義類名意味着您的樣式表中的一個簡單的變化，並且您的代碼繼續表示它所說的內容。如果它只是「被選中」，那麼是的，這很容易。 tr class =「selected」，而不是class。 – 2010-05-31 03:50:19

如何使用jQuery檢查css值？

回答

相關問題