iOSにおけるHTML5のtype属性の動作

2011年06月10日 公開

HTML5において、<input>に対するtype属性が大幅に増加する予定なんだけれども、ブラウザによっては未実装なことがまだまだ多い。それに、キーボードを使うのであれば現状のままでもとくに大きく気にすることはないと言えないこともない。ただし、iPod touch で、フォームの入力等に手間取ることが多いので、すでに iOS5 が発表となりましたが iOS4.3 mobile Safari でその動作を確かめてみた。

type="tel"

type=tel

電話番号入力を想定して設定されたものと思われる。だから、電話番号とかFAX番号を入力して貰うときにはこの属性を使用したらよいということだろう。

入力キーとしてテンキーが表示されて、非常に都合がいい! ただし、時々意地悪な入力フォームで「ハイフンを入れてください」とか要求してくるフォームがある。その場合、ハイフンの用意が無いので入力できなくなる。数字以外は「+」「*」「#」だ。

以前のバージョンではポーズが入っていたような気がするけれども、使わないね。でもハイフンはあった方が便利かもしれないと思う。

type="number"

type=number

電話番号入力のときも、こっちでいいんじゃなかろうか? と思わせる。でも、入力の自由度が高いと混乱が大きくなることも充分に考えられる。うむ。

"tel""number"を比較すると、ハイフン問題がどうでもいいのならば、郵便番号入力なんかも、"number"よりも"tel"の方が親切なような感じがしなくもない。っていうか、"tel"にハイフンが加われた一挙解決

入力窓が微妙に小さいのはどういうことだろう?

type="email"

type=email

こりゃ、いいですね! 「@」が英字と共に表示されているということは非常に大切な気がする。どんなメアドにも、最低1つの「@」が入っているのが決まりきっているから。

でも、e-mailアドレス入力用ならば「space」不要じゃね? 代わりにハイフン「-」またはアンダースコア「_」の方が需要ある。

type="url"

type=url

にゃるほどぉ。そうきたか。便利なことは便利に違いない。でも、URLを入力するとだいたい「http://」から始まるので、そういうボタンがあってもいいし、それが無くてもせめて「:」は表に出しておいてもらいたかったなぁ。

そんなことない?

まぁ「:」は必ず1つ出てくるけれども、2つ以上出てくることはかなりまれですね。だからいいのかな。

でもメアド用の場合、必ず1コ出てくるけど2コは出てこない「@」のボタンがあるけど!

これらの性能は、スマートフォンなどではかなり有効になってくることだと思われるので、忘れずに実装してゆきたいところ。しかしキーボードが別物であるパソコンなどに於いては、これだけの使い方ではあまり意味が無いかも。他のスクリプトなんかと組み合わせて使う時には便利なことも……想像できないわけじゃないけど。

こういうの、機能としてはこれくらいにとどめておいて、あとの部分はカスタマイズできるっていうのどうですかね? そしたら、メアドをどこかのキーに登録しておくとか、電話帳リストからグッと引っ張ってこられるとか、どんどん便利になる予感。

あまり便利にしすぎると、間違って他人の個人情報を大公開という事故も起こりかねませんけど!

.