2007-01-08
コメントフォーム
textareaには入力を解りやすくする為に何かテキストを記述しておくべきですが、入力する時点で表示されたテキストを削除する必要があります。これはコメントをいただく際に非常に面倒な作業となります。
イベントハンドラ(onfocus・onblur)を使ってMovableTypeのコメントフォームをちょっとかっこよくしてみます。
<textarea id="comment-text" name="text" rows="15" cols="50" tabindex="5" accesskey="t" onfocus="if(this.value=='Leave your comment here.'){this.value='';}" onblur="if(this.value==''){this.value='Leave your comment here.';}">Leave your comment here.</textarea>
このブログで実装しています
id・name・tabindex・accesskeyはご自身の環境に合わせて変更してください。
1月16日追記
Open MagicVox.net上記リソースを参考に以下のように修正いたしました。
<textarea id="comment-text" name="text" rows="15" cols="50" tabindex="5" accesskey="t" onfocus="(t=this).def_value||(t.def_value=t.value);t.def_value==t.value&&(t.value='');" onblur="(t=this).value==''&&(t.value=t.def_value);">Leave your comment here.</textarea>
投稿者 @Style : 2007年01月08日 17:55
前のエントリー:テンプレートバージョン2.0をご利用の皆様へ
次のエントリー:エントリータイトル
トラックバック
このエントリーのトラックバックURL:
http://atstyle.biz/blog/mt-tb.cgi/596
このリストは、次のエントリーを参照しています: コメントフォーム:
» ブログのコメント投稿フォームをちょっぴり親切にする from Open MagicVox.net
ブログのコメント投稿フォームに初期メッセージを設定しておき, 入力フォーカスが当たった時点でこれを消すという tips が紹介されています。 元ネタであ... [続きを読む]
トラックバック時刻: 2007年01月16日 13:15
![Web標準 Webサイト制作 [アットスタイル] アットスタイル](http://atstyle.biz/webimg/atstylelogo.png)

