3

I have this html code 

<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>

and this jQuery function

function clearSelect(thisfield, id) {

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

When I click the select book the background of the select box changes to white but the drop down list stays the same color until you scroll down it.

Any ideas how to change all the option background colors to white when the select box is clicked?

4

2 回答 2

2

您可能希望将该.css()方法与.children()and结合使用.andSelf()（因此它会影响选择和选项）：

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

此外，无需.css()多次调用该方法，您可以使用属性值集的映射一次...

于 2012-11-20T16:00:15.757 回答
1

我不希望选择框中的每个选项都有边框，所以我将功能更改为此

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-20T16:34:30.030 回答