
下記のドロップダウンメニューで
「野球について」「サッカーについて」の行は見出しの役割なので
選択できないようにしたいのですが、どうしたらいいでしょうか。
<option disabled>野球について</option>
としてみましたが、ダメでした。
<html>
<body>
<select onchange="location.href=this.options[this.selectedIndex].value">
<option value="./0.html">ルールトップ</option>
<option>野球について</option>
<option value="./1.html"> ├アウト</option>
<option value="./2.html"> ├セーフ</option>
<option value="./3.html"> ├ストライク</option>
<option value="./4.html"> └ボール</option>
<option>サッカーについて</option>
<option value="./5.html"> ├ゴール</option>
<option value="./6.html"> ├フリーキック</option>
<option value="./7.html"> ├オフサイド</option>
<option value="./8.html"> └ファール</option>
</select>
</body>
</html>
No.2ベストアンサー
- 回答日時:
optgroupってご存じないですか?
一度こちらでテストしてみてはいかがでしょうか?
<html>
<body>
<select onchange="location.href=this.options[this.selectedIndex].value">
<option value="./0.html">ルールトップ</option>
<optgroup label="野球について">
<option value="./1.html">├アウト</option>
<option value="./2.html">├セーフ</option>
<option value="./3.html">├ストライク</option>
<option value="./4.html">└ボール</option>
</optgroup>
<optgroup label="サッカーについて">
<option value="./5.html">├ゴール</option>
<option value="./6.html">├フリーキック</option>
<option value="./7.html">├オフサイド</option>
<option value="./8.html">└ファール</option>
</optgroup></select>
</body>
</html>
結論から言いますと、おかげさまで完璧です。
optgroupってSELECTの属性を調べていたら
何度か目にしたキーワードなのですが、
こういう使い方だったのですね。
ありがとうございました。
No.3
- 回答日時:
コレは論外ですか?
<html>
<body>
<select onchange="location.href=this.options[this.selectedIndex].value">
<option value="./0.html">ルールトップ</option>
<option>野球について</option>
<option value="./1.html"> ├アウト</option>
<option value="./2.html"> ├セーフ</option>
<option value="./3.html"> ├ストライク</option>
<option value="./4.html"> └ボール</option>
<!--<option>サッカーについて</option>
<option value="./5.html"> ├ゴール</option>
<option value="./6.html"> ├フリーキック</option>
<option value="./7.html"> ├オフサイド</option>
<option value="./8.html"> └ファール</option>-->
</select>
</body>
</html>
アドバイスありがとうございました。
質問の仕方が悪くてすみませんでしたが
コメントで不可視にするというのではなく、
マウスで選択することができない、という
動作を望んでいました
NO2さんの方法で解決しました。
ありがとうございました。

No.1
- 回答日時:
ご質問にある
><option disabled>野球について</option>
はFirefoxやOperaでは使用できますが
IEではdisabled属性をoptionには使用できないようですね。
<option value="NG">サッカーについて</option>
とかにしておいて
onchangeの後にワンクッション挟んで
スクリプトでvalueが"NG"の項目を選ばれたら
フォーカスを外すなどで回避したら如何でしょう。
なるほど、FirefoxやOperaでしか使えなかったのですね。
「onchangeの後にワンクッション挟んで」というのも
考えようと思いましたが
結局NO2さんの方法で解決しました。
大変参考になるアドバイスありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript 中百舌鳥駅と深井駅を入れ替えて選択しても同じ挙動にしたいです。 2 2022/06/24 18:45
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript 1度きりではなく、繰り返し、挙動が変わるようにしていただきたいです。 1 2022/07/03 15:50
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript 電車の運賃を出すプログラムを作っています。 2 2022/06/22 09:36
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
- JavaScript jsでは、'で区切った部分を改行することはできない。〇か×か。 1 2022/06/26 19:58
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
セレクトボックスを非表示にし...
-
テキスト入力後に選択項目を変...
-
文字の横にプルダウンを表示さ...
-
SELECT要素の垂直位置
-
ドロップダウンメニューで特定...
-
rssティッカーの横幅を1000にし...
-
複数列を持ったリストボックス...
-
プルダウンメニューの幅
-
セレクトボックスのselected属...
-
<SELECT>タグの折り返し
-
optionのselectedは更新時は効...
-
リストの項目を表示のみで、選...
-
selectタグ内の特定のoptionの...
-
セレクトメニューで選んだ値を...
-
SELECT OPTIONの中身をコピペ...
-
Application.ScreenUpdating = ...
-
perl セレクトメニューを ↓の...
-
JSONで文字列が長い時
-
メモリをアドレスを直接指定し...
-
formで特定のinputを送信しない...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
セレクトメニューで2つの項目...
-
<SELECT>タグの折り返し
-
テーブル内でドロップダウンメ...
-
複数列を持ったリストボックス...
-
文字の横にプルダウンを表示さ...
-
optionのselectedは更新時は効...
-
セレクトボックスの「選択して...
-
セレクトボックスから別窓にジ...
-
プルダウンメニューで中央表示
-
プルダウンリストの背景色の指定
-
SELECT要素の垂直位置
-
セレクトボックスのselected属...
-
apacheでcookieを扱いたい
-
セレクトボックスの中を一部隠...
-
selectタグ内の特定のoptionの...
-
セレクトメニューで選んだ値を...
-
リストボックスの選択をURL名に...
-
SELECT OPTIONの中身をコピペ...
-
セレクトボックスの内容を中央寄せ
-
HTMLでメディアプレイヤーの再...
おすすめ情報