jQueryでInputフィールドを操作する小技いろいろ
- October 21st, 2009
- Posted in jQuery関連
- Write comment
ちょっとメモ的にエントリー。Twitterなどでよくみる、リアルタイムに「あと何文字」を表示する方法などですよ。jQueryのコードがそのまま掲載されているので勉強になりますね。
紹介されているのは以下のような小技です。全部で5つですね。
- 文字数をカウント
- 残り文字数をカウント
- エラーチェック
- リストから入力
- リストへ入力
入力された文字数をリアルタイムにカウントします。
![]()
今度は逆に残り文字数を表示します。Twitterでよく見ますね。
![]()
入力値によってエラーメッセージを表示します。
![]()
リストをクリックしたらInputフィールドに値を入力します。

逆にInputフィールドからリストへ値を入力します。

実際のコード&マークアップは元記事をどうぞ。うまいこと使ってわかりやすいフォームを作りたいですね。
» jQuery Lessons Series: How to Interact with HTML Forms – woorkup.com


No comments yet.