テキストボックステキストフィールドヒント自動表示非表示jQueryプラグイン

<h4>      </h4>
<p><input class="remindAuto" type="text" size="45" value="     " /></p>
<h4>  class   </h4>
<p><textarea class="textarea borderChange">      </textarea></p> 
<h4>       </h4>
<p><input id="textColorChg" type="text" size="45" value="     ..." /></p>

 

 1 (function($){
 2 $.fn.textRemindAuto = function(options){
 3 　　var options = options || {};
 4 　　var defaults = {
 5 　　　　blurColor : '#999',
 6 　　　　focusColor : '#333',
 7 　　　　auto : true,
 8 　　　　chgClass :''
 9 　　};
10 　　var settings = $.extend(defaults,options);
11 　　if( settings.auto ){
12 　　　　var v = $.trim($(this).val());
13 　　　　if( v ){
14　　　　 $(this).each(function(i){
15 　　　　$(this).focus(function(){
16 　　　　if( $.trim($(this).val()) === v ){
17 　　　　$(this).val('');
18 　　};
19 　　$(this).css('color',settings.focusColor);
20 　　if( settings.chgClass ){
21 　　　　$(this).toggleClass('border');
22 　　}
23　　 }).blur(function(){
24 　　　　if( $.trim($(this).val()) === '' ){
25 　　　　$(this).val(v);
26 　　};
27 　　$(this).css('color',settings.blurColor);
28 　　　　if( settings.chgClass ){
29 　　　　　　$(this).toggleClass('border');
30 　　　　};
31 　　});
32 　});
33 };
34 }
35 }
36 })(jQuery)
37 
38 //    
39 $('.remindAuto').textRemindAuto();
40 $('.borderChange').textRemindAuto({chgClass:'border'})
41 $('#textColorChg').textRemindAuto({focusColor:'red'})

猛点Demo:http://220.194.52.12:8088/text-remind-auto-hide-show.html