Workaround iPhone's browser not honoring the <label> element
Posted
by Sorin Comanescu
on Stack Overflow
See other posts from Stack Overflow
or by Sorin Comanescu
Published on 2010-06-14T08:51:44Z
Indexed on
2010/06/14
9:12 UTC
Read the original article
Hit count: 371
iphone
|iphone-web
Hi,
Just ran into this recently and I thought it'd be helpful to share.
The HTML <label>
element is supported in a weird way by iPhone's (v3) browser. Try this:
<input type="checkbox" id="chkTest" /><label for="chkTest">Click me!</label>
Tapping the "Click me!" label has no effect, the checkbox is not checked.
Lack of support in a touch device for <label>
elements puzzled me and I tried to overcome this issue by using javascript. The surprise came when a I noticed a void javascript like the one below also did the trick:
<input type="checkbox" id="chkTest" /><label for="chkTest" onclick="javascript:void(0);">Click me!</label>
HTH
Further info:
- Also works with an empty handler:
onclick=""
- Disabling JavaScript inactivates again the label, even if using the empty handler.
© Stack Overflow or respective owner