![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?8acaa2e)
お世話になっております。
以前こちらで質問させていただき、またつまずいたので質問させてください。
何度も申し訳ございません。
現在、
<script type="text/javascript">
<!--
var bc = ["#FF0000","#00FF00","#0000FF","#FFFFFF"];
function chBackGround(e) {
e.style.backgroundColor=bc[e.selectedIndex];
}
window.onload = function() {
document.getElementById('key').style.backgroundColor=bc[0];
}
// -->
</script>
------------------------------------------------------------
html部分
<select id="key" name="key" onChange="chBackGround(this)">
<option style="background-color: #FF0000;">サンプル0</option>
<option style="background-color: #00FF00;">サンプル1</option>
<option style="background-color: #0000FF;">サンプル2</option>
<option style="background-color: #FFFFFF;">サンプル3</option>
</select>
としており、プルダウンで選ばれたカラーのスタイルを<select>タグに埋め込んでおります。
上記だと、この画面を初期表示時、<select>部分に読み込まれるプルダウンの色が、必ずbc[0](サンプル0の色)になります。
例えば、サンプル2のoptionにselectedが記載されていた場合、画面の初期表示はbc[2](サンプル2の色)にしたいのですが、この方法をご教授いただけませんでしょうか。
お忙しいところ申し訳ございません。
どうぞ宜しくお願いいたします。
No.1ベストアンサー
- 回答日時:
スクリプト部分を次のように。
function chBackGround(e){
e.style.backgroundColor=
e.options[e.selectedIndex].style.backgroundColor;
}
window.onload = function() {
chBackGround(document.getElementById('key'));
}
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript 電車の運賃を出すプログラムを作っています。 2 2022/06/22 09:36
- JavaScript 中百舌鳥駅と深井駅を入れ替えて選択しても同じ挙動にしたいです。 2 2022/06/24 18:45
- JavaScript 1度きりではなく、繰り返し、挙動が変わるようにしていただきたいです。 1 2022/07/03 15:50
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HTMLのoptionタグ部分に画像を...
-
Rails のコンボボックス(selec...
-
<SELECT>タグでの selected 状...
-
複数のプルダウンからリンクす...
-
フォームに入力した値をURLに付...
-
formタグのactionパラメータで...
-
JavaScript 超初心者です。 Doc...
-
submit時に違うページに飛びたい
-
チェックボックスをチェックし...
-
1アクションでPOST・GET、両方...
-
IE6でiframeにPOSTできない
-
ファイヤーフォックスでフォー...
-
submitをボタン以外にするには
-
【html】)パスワード認証フォー...
-
リンクをクリックした時にform...
-
au着うたのダウンロード
-
長文のmailtoの使い方
-
フォームのテキストボックス内...
-
inputtype=hiddenとは?
-
mailtoによる送信ができない
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
HTMLのoptionタグ部分に画像を...
-
プルダウンメニューで、選択項...
-
2つの<select>フォームの完全...
-
プルダウンメニュー項目のフォ...
-
jQuery if文の条件分岐 (。ノд...
-
VB6.0でコントロール配列の配列...
-
<SELECT>タグでの selected 状...
-
セレクトボックスの幅をプルダ...
-
チェックボックスにチェックで...
-
オプションメニューのアイテム...
-
プルダウンメニューアイテムの...
-
カタカナ変換を一発でする方法
-
メール予約フォームを壊してし...
-
プルダウンメニューを選択した...
-
プルダウン 背景色の変更
-
プルダウンメニューでインライ...
-
日付リストボックスの制御について
-
javascriptでプルダウンメニュ...
-
selectの選択肢の説明を表示す...
-
プルダウンのリンクについて
おすすめ情報