[解決済み】radio入力フィールドで "required "属性を使用する方法
2022-03-23 06:35:25
質問内容
HTML5の新しい入力属性である"required"をラジオボタンに正しく使用するにはどうすればよいのか悩んでいます。ラジオボタンの各フィールドには以下のような属性が必要なのでしょうか、それとも1つのフィールドだけが属性を取得すれば十分なのでしょうか?
<input type="radio" name="color" value="black" required="required" />
<input type="radio" name="color" value="white" required="required" />
解決方法は?
TL;DR
required
属性を、ラジオグループの少なくとも1つの入力に設定します。
設定方法
required
をすべての入力に使用する方がより明確ですが、(ラジオボタンを動的に生成する場合を除き)必要ではありません。
ラジオボタンをグループ化するには、すべてのラジオボタンが同じ
name
の値を指定します。これにより、一度に1つだけ選択することができ、適用される
required
をグループ全体に適用します。
<form>
Select Gender:<br>
<label>
<input type="radio" name="gender" value="male" required>
Male
</label><br>
<label>
<input type="radio" name="gender" value="female">
Female
</label><br>
<label>
<input type="radio" name="gender" value="other">
Other
</label><br>
<input type="submit">
</form>
また、注意してください。
ラジオボタンのグループが必須であるか否かの混乱を避けるため、グループ内のすべてのラジオボタンにこの属性を指定することが推奨されます。実際、一般に、ラジオボタングループには初期状態でチェックされているコントロールがないことを避けることが推奨されています。
関連
-
[解決済み] 名前が''の無効なフォームコントロールはフォーカスされない
-
[解決済み] 順序なしリストが div 内で左いっぱいに整列されない
-
[解決済み] textareaのresizableプロパティを無効にするにはどうしたらよいですか?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] Webフォームのフィールド/入力タグでブラウザのオートコンプリートを無効にするにはどうすればよいですか?
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] HTMLのid属性に有効な値は何ですか?
-
[解決済み] <button> vs. <input type="button" />. Which to use?
-
[解決済み] HTML5でfloat入力タイプはありますか?
-
[解決済み】jQueryで、name属性で要素を選択するにはどうすればいいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】エラー。要求されたURL"[no URL]"は無効です。
-
[解決済み] span with onclick event inside the tag
-
[解決済み] Bootstrapのカラムが機能しない
-
[解決済み] 絶対位置が機能しない
-
[解決済み] 迷子の終了タグ "head"
-
[解決済み] css画像が表示されない
-
[解決済み] 以下のHTMLフォームの例で、「mailto:[email protected]」とは何ですか?
-
[解決済み] HTML5 Canvas 要素でカスタムフォントを使用するにはどうすればよいですか?
-
[解決済み] 送信ボタンが機能しない
-
[解決済み] HTMLボタンのテキストを固定幅で折り返すには?