jQuery的 - 的選擇選項更改背景顏色，當點擊

我有這樣的HTML代碼jQuery的 - 的選擇選項更改背景顏色，當點擊

<p> 
    <label for="contact">Contact name<span class="required"> *</span></label> 
    <select name="contact" id="contact" onClick="clearSelect(this,'contact')"> 
    <option value="">Select Contact</option> 
    <?php foreach ($contacts as $contact): ?> 
<option value="<?php htmlout($contact['id']); ?>" 
    <?php if ($contact['id'] == $contactID) echo ' selected="selected"';         
    ?>><?php htmlout($contact['name']); ?></option> 
    <?php endforeach; ?> 
    </select>  
</p>

這jQuery函數

function clearSelect(thisfield, id) { 

$j("#" + id).css("background-color","#FFF"); 
$j("#" + id).css("border","1px solid #CCCCCC"); 
$j("#" + id).css("color","#000000"); 
}

當我點擊選擇書的選擇框更改背景白色，但下拉列表保持相同的顏色，直到你向下滾動。

任何想法如何在點擊選擇框時將所有選項背景顏色更改爲白色？

來源

2012-11-20 Kevin Foley

您可能需要使用.css()法.children()和.andSelf()組合（所以它影響選擇和選項）：

function clearSelect(thisfield, id) { 
    $j("#" + id).children().andSelf().css({"background-color":"#FFF", 
     "border":"1px solid #CCCCCC", 
     "color":"#000000"}); 
}

而且，沒有必要到.css()方法多次調用，您可以做一個單一的時間地圖的一個屬性值組的...

來源

2012-11-20 16:00:15 DarkAjax

+1優化。 –

感謝您的幫助。我把你的功能替換掉了，但是現在當我點擊選擇框時什麼也沒有發生。背景不會改變。 –

對不起，我有一個拼寫錯誤（'chilren'而不是'children'），以防萬一我改變了你的代碼有一點做了測試http://jsfiddle.net/darkajax/mXrSd/2/ – DarkAjax

我不想在每個選擇框中的選項的邊界，所以我改變了功能，這

function clearSelect(thisfield, id) { 
$j("#" + id).children().andSelf().css({"background-color":"#FFF", 
    "border":"1px solid #CCCCCC", 
    "color":"#000000"}); 
$j("#" + id).children().css({ 
    "border":"0px solid #CCCCCC" 
    }); 
}

這是怎麼回事？當我點擊選擇框時，出現選項菜單，但只有當我將鼠標懸停在每個選項上時，背景顏色纔會變化。這很奇怪。

來源

2012-11-20 16:34:30

jQuery的 - 的選擇選項更改背景顏色，當點擊

回答

相關問題