本日はHTMLのinputのラジオボタンについて解説していきたいと思います。
それではいってみましょう!
radioの概要
一つのみを選択させたい場合にname属性値を同じ名前にすることでどれか一つが選択されます。
属性
type → radioを指定するとラジオボタンが作成されます。
name → name属性値を一緒の名前にしてグループ化します。
value → value属性値を指定することで遷移先で取得できます。
checked → 初期の選択を指定できます。
サンプル例
1 2 3 4 5 | <form action="" method="POST"> <input type="radio" name="gender" value="male" checked="checked"> 男 <input type="radio" name="gender" value="Female"> 女 <input type="submit" value="送信"> </form> |
下記のようにブラウザに表示されます。
ラジオボタンはどれか一つのみ選択が可能です。
男の属性にchecked=”checked”とすることで初期に男が選択された状態になります。
まとめ
今回はラジオボタンについて解説しましたがname属性値を同じ名前にすることでグループ化され、どれか1つのみの値を取得したい場合に使用されます。
HTML単体では特に使用する機会はありませんがPHPのGETやPOST、データベースと最終的には連携させていきます。
以上です。