for 属性によるラベルとコントロールの関連付け

スポンサーリンク

html5 ではラベルの for 属性を利用してコントロールとの関連付けを行うことができます。関連付けを行ったラベルをクリックすると、コントロールにフォーカスしたり、選択することができるようになります。

    ラベルの"Text1"をクリックするとテキストボックスにフォーカス
<label for="Text1">Text1</label>
<input id="Text1" type="text" />

テキストのRadio~をクリックするとラジオボタンにチェック
<input id="Radio1" type="radio" name="group1" /><label for="Radio1">Radio1</label>
<input id="Radio2" type="radio" name="group1" /><label for="Radio2">Radio2</label>
<input id="Radio3" type="radio" name="group1" /><label for="Radio3">Radio3</label>

ラベルの”Text1″をクリックするとテキストボックスにフォーカス

テキスト部分(Radio~)をクリックするとラジオボタンにチェック



コメント

タイトルとURLをコピーしました