3

個人のデフォルトの背景を変更したいこの複数選択があります<option>

<select size="8" name="lstSelectedPackages" style="width:100%">
  <option value="" selected="selected">Select</option>
</select>

フィドル: http://jsfiddle.net/ux4DD/180/

ありがとうございました！

4

5 に答える 5

2

以下のようにスタイルの背景を変更するだけです

<select size="8" name="lstSelectedPackages" style="width:100%; background:#fff999">
    <option value="" selected="selected">Select</option>
</select>

すべての選択タグに対してそれを実行したい場合は、cssに以下のコードを追加できます

select{
   background: #fff999;
}

ただし、次のようにjqueryを使用できます。

$("option:selected").css{"background", "#fff999"}
于 2013-02-13T10:53:33.537 に答える
2

があなたjQueryに最適である場合、これが確実に役立つと確信しています。

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">

    $(function()
    {

        $("select option:selected").each(function ()
        {
            $(this).css('background-color','red');
        });

    });

</script>
<select name="garden">
    <option>Flowers</option>
    <option selected="selected">Shrubs</option>
    <option>Trees</option>
    <option>Bushes</option>
    <option>Grass</option>
    <option>Dirt</option>
</select>
<div></div>
于 2013-02-13T11:04:01.980 に答える
1

このような答えが欲しいと思います

Jクエリ

$('.mySelect').change(function () {
$(this).find('option').css('background-color', 'transparent');
$(this).find('option:selected').css('background-color', 'red');
}).trigger('change');

HTML

<select class="mySelect">
<option value="1" selected="selected">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>

デモ参照 リンクを参照

于 2013-02-13T11:10:32.793 に答える
1

それを行う方法を示す更新されたフィドル: http://jsfiddle.net/ux4DD/181/

クロスブラウザーのスタイリングに関しては、select は信頼できないことで知られているため、すべてのブラウザー/バージョンでスタイリングが一貫して表示されない可能性があることに注意してください。

select {
    height:50px;
    background-color: #dcdcdc;
}

1 つの選択だけに特定の背景色/スタイルを持たせたい場合は、クラスを使用してそれを定義します。

<select class="my-select-class">
 <option>2</option>
</select>

.my-select-class {
    background-color: #dcdcdc;
}

Web ページでインライン スタイルを使用することはお勧めしません。

外部スタイルシートに固執します。

于 2013-02-13T10:54:38.667 に答える
1

使用するbackground-color

select{
  height:50px;
  background-color:green;

}

更新しました

jqueryを使用しています。

$('option').css('background', 'none');
$('option:selected').css('backgroundColor', 'red');

ここでフィドル

于 2013-02-13T10:55:36.190 に答える