2011年03月30日
チェックボックス・ラジオボタンのテキストをクリックしてチェック
テキストボックス・ラジオボタンのテキストの部分をクリックしてチェックをいれる方法です。
ラベルタグを使用するとできるようになります。
以下に例を記述します。
<form>
<input type="checkbox" value="check1" name="sample1" id="no1" /><label for="no1">テキスト1</label><br />
<input type="radio" value="check2" name="sample2" id="no2" /><label for="no2">テキスト2</label>
</form>
実際の表示です。
-----------------------------------------------
-----------------------------------------------
実際にテキストの部分をクリックしてみてみると、チェックボックスやラジオボタンにチェックがはいります。
以上のようにチェックボックス・ラジオボタンにid属性を付け加え、ラベルタグのfor属性にそのidを記述します。
ラベルタグを使用するとできるようになります。
以下に例を記述します。
<form>
<input type="checkbox" value="check1" name="sample1" id="no1" /><label for="no1">テキスト1</label><br />
<input type="radio" value="check2" name="sample2" id="no2" /><label for="no2">テキスト2</label>
</form>
実際の表示です。
-----------------------------------------------
-----------------------------------------------
実際にテキストの部分をクリックしてみてみると、チェックボックスやラジオボタンにチェックがはいります。
以上のようにチェックボックス・ラジオボタンにid属性を付け加え、ラベルタグのfor属性にそのidを記述します。
この記事へのコメント