コメントフォーム

textareaには入力を解りやすくする為に何かテキストを記述しておくべきですが、入力する時点で表示されたテキストを削除する必要があります。これはコメントをいただく際に非常に面倒な作業となります。

イベントハンドラ(onfocusonblur)を使って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>

このブログで実装しています

idnametabindexaccesskeyはご自身の環境に合わせて変更してください。

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&amp;&amp;(t.value='');" onblur="(t=this).value==''&amp;&amp;(t.value=t.def_value);">Leave your comment here.</textarea>
Posted