iOS5のSafariでlabelとcheckboxが連動しない対策

iOS5のSafariでは、forで紐付けたlabelとcheckboxを連動できない。

<input id="test_check" type="checkbox">
<label for="test_check">チェックする</label>

この対策でよく見かける方法が、空のjavascriptのclickイベントを記述するやり方。

<input id="test_check" type="checkbox">
<label for="test_check" onClick="">チェックする</label>

一括指定もできる。labelとcheckboxのセットが大量にある場合はこっちのほうが便利。
ただし、labelをクリックしたときに動作させるjavascriptを組み込みたい場合は競合の心配があるので注意。

<input id="test_check" type="checkbox">
<label for="test_check">チェックする</label>
$("label").click(function(){});

関連記事

Pocket