HTML5のFormで実現されるplaceholder、autofocusが便利そう

SPONSORED LINK

Pocket

HTML5、あまり勉強していないのですが、Form機能も強化されるようですね。nettutsでplaceholder、autofocusなるタグが紹介されていましたよ。

今まではJavaScriptを駆使して実現していた機能だけに、HTMLだけでブラウザがうまいこと解釈してくれると確かに便利ですね。

■ placeholder

フォームのインプット部分に淡くガイドテキストを表示する機能ですね。

<input type="text" name="myname" placeholder="input your name" />

↑ こういう風に記述すると…。

↑ こう表示されます。

■ autofocus

これはわかりやすいですね。inputタグに「autofocus」と入れておくとそこにフォーカスを当ててくれますよ。

<input type="text" name="phone" autofocus />

↑ マークアップがこんな感じだと…。

↑ おー、便利。

もちろんブラウザの対応待ちですが、iPhone/iPadなんかだともう使い始めることができますよね。今のうちから慣れておこうかなぁ・・・。

» Quick Tip: New HTML5 Form Features | Nettuts+

ツイッターもやっています!

SPONSORED LINK

  1. No comments yet.

  1. No trackbacks yet.