お世話になっております。
以前こちらで質問させていただき、またつまずいたので質問させてください。
何度も申し訳ございません。
現在、
<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ランキング
-
プルダウンメニューでインライ...
-
2つの<select>フォームの完全...
-
jQuery if文の条件分岐 (。ノд...
-
クリックすると下に項目が出て...
-
プルダウンメニューアイテムの...
-
複数のプルダウンメニューの設...
-
VB6.0でコントロール配列の配列...
-
チェックボックスにチェックで...
-
リンクをクリックした時にform...
-
submitをボタン以外にするには
-
input date について
-
UTF-8 コードでのmailtoの文字化け
-
送信ボタン押下時に値が未入力...
-
画像をボタンのようにフォーカ...
-
指定したデータを別ページフォ...
-
1アクションでPOST・GET、両方...
-
会員登録フォームの作り方を教...
-
checkboxを「変更不可」にでき...
-
CGI動作後に元のページに戻る方法
-
チェックボックスをチェックし...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
HTMLのoptionタグ部分に画像を...
-
プルダウンの切り替えについて
-
プルダウンメニュー項目のフォ...
-
<SELECT>タグでの selected 状...
-
セレクトボックスの幅をプルダ...
-
switch文のswitch(n)の部分を複...
-
セレクトボックスを2つ設けて選...
-
セレクトボックスを切り替える...
-
jQuery要素の絞り込み + <selec...
-
複数のプルダウンの値をパラメ...
-
プルダウンを2つ以上並べる時に...
-
プルダウンメニューアイテムの...
-
HPビルダー9で、プルダウン形...
-
リストボックス全選択について
-
プルダウンメニューで、選択項...
-
複数のプルダウンからリンクす...
-
複数のプルダウンメニューの設...
-
子ウインドウを開く際、フォー...
-
VB6.0でコントロール配列の配列...
-
プルダウンでリンク先へいくと...
おすすめ情報