【メモ】ラジオボタン/チェックボックスを文字列で選択する。

ラジオボタンとか、チェックボックスってありますよね。
こんなやつ。

好き
嫌い
どうでもいい

連絡下さい

文字列をクリックすることでこれを選択するのってよく見掛けるけど、
アレどうやるんだろう…と思ってたんだけど、
もの凄く単純なことだったんですね…最近知りました。

…あれ、俺だけ？

妙に恥ずかしいので、恥ずかしまぎれにメモっとく。

やり方は至極簡単で文字列にlabel要素を設定するだけ。

input要素にはそれぞれ固有のid属性を設定し、
そのid値をlabelのfor属性に設定する。


<input type="radio" id="like" name="like" value="1"><label for="like">好き</label>
<input type="radio" id="dislike" name="like" value="0"><label for="dislike">嫌い</label>
<input type="radio" id="none" name="like" value="2"><label for="none">どうでもいい</label>

<input type="checkbox" id="contact" name="contact" value="1"><label for="cotact">連絡下さい</label>