いいですよね。テレサ・テン。
こんばんは。小林です。
さて、突然ですが、みなさん。フォーム作ってますか？
このブログを見てくださってるということは、今まで作ったフォームの数を覚えていないくらい作ったことがおありかと思います。
そうでない皆様にご説明致しますと、お問い合わせ的なあれです。
そう、インターネッツでよく見かけるあれです。
ガンプラ作りながらネットサーフィンしてるとよく見かけると思うんです。
こんな感じのやつです。
どれか一つ選びましょうってやつですね。
で、これ、選択する際は文字の部分を押下しますよね？
押しやすいですもんね。
ところが、
iPad、というかiOSのバージョン5（恐らくバージョン5以前）だと、文字の部分をタップしても選択できないのです。
丸い部分をタップすればいいんですが、あんな小さい丸なんてタップできませんよね。
困りました…。
半ば諦めかけていたところ、デザイナーの誠人が教えてくれました。
「山は高きを厭わず海は深きを厭わず」
なるほど、labelにonclick属性を指定してやればいいんですね！
中身は空で大丈夫でした。
以下が、参考までにHTMLです。
<label for="RadioA" onclick=""><input type="radio" id="RadioA" name="radio"> つぐない</label>
<label for="RadioB" onclick=""><input type="radio" id="RadioB" name="radio"> 愛人</label>
<label for="RadioC" onclick=""><input type="radio" id="RadioC" name="radio"> 時の流れに身をまかせ</label>こんなjavascriptでもいいかも知れませんね。
(function(){
Array.prototype.forEach.call(
document.body.querySelectorAll('label'),
function(l){
l.onclick = l.onclick || function(){}
}
);
}());これで文字をタップしても選択できるようになりました。
ありがとう、誠人。
世界中の全ての子供達に愛と平和が訪れますように…。
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。
