フォームに予めテキスト入れておいて、クリックしたら削除して、さらに色を変える方法
- 2010年 10月28日
フォームに、「お名前を入力して下さい」のように、テキストを入れておいて、
実際にユーザが入力するとき(フォーカスがあたったとき)には、テキストをすべて削除する場合、下記jqueryプラグインを使うと簡単。
http://ajaxcssblog.com/jquery/fieldtag-watermark-inputfields/
今回はさらに、最初のテキストはグレーで表示したいけど、ユーザ入力時はクロにしたいというニーズがあったので、ちょっと書き換えてみた。
if(!this.changed){
$(this)
.val(“”)
.removeClass(opt.markedClass)
.css(“color”,”black”);
}
if(!this.changed){ $(this) .val(“”) .removeClass(opt.markedClass) .css(“color”,”black”); }
赤色部分を追加。
さらに、addTab部分も同様に、
.css(“color”,”grey”);
を追加。