banxitan
          

          

          


          
	
		

          統計
          
	
		

          留言簿(2)
          


        
		

        

          閱讀排行榜
          


		

          評論排行榜
          


	

          

          
	
					
	
          
		
          
			jQuery實現input文本框內灰色提示文本效果 和  input標簽獲取焦點是文本框內提示信息清空 
		
          
		
          一、jQuery實現input文本框內灰色提示文本效果
          

          

          <html>  
          
          <head>  
          
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
          
          <title>input test</title>  
          
          <script type="text/javascript"
          
    src          ="./js/jquery.js"></script>
          
          <script type="text/javascript">  
          
          function inputTipText(){    
          
$(          "input[class*=grayTips]") //所有樣式名中含有grayTips的input   
          
          .each(function(){   
          
             var oldVal=$(this).val();   //默認的提示性文本   
          
             $(this)   
          
   .css(          {"color":"#888"})  //灰色   
          
             .focus(function(){   
          
              if($(this).val()!=oldVal){$(this).css({"color":"#000"})}else{$(this).val("").css({"color":"#888"})}   
          
   }          )   
          
   .blur(          function(){   
          
              if($(this).val()==""){$(this).val(oldVal).css({"color":"#888"})}   
          
   }          )   
          
   .keydown(          function(){$(this).css({"color":"#000"})})   
          
     
          
}          )   
          
}             
          
  
          
$(          function(){   
          
inputTipText();            //直接調用就OK了   
          
          }          )   
          
          </script>  
          
          </head>  
          
          <body>  
          
          <input type="text" value="輸入您的用戶名" class="grayTips" />  
          
          <input type="text" value="輸入您的登錄密碼" class="aaagrayTips"/>  
          
          </body>  
          
          </html>
          
二、input標簽獲取焦點是文本框內提示信息清空 
          

          

          <html>
          
          <head>
          
          <title></title>
          
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
          
          </head>
          
          <script language="javascript" type="text/javascript"> 
          
          function addLoadEvent(func){
          
              var oldonload = window.onload;
          
              if (typeof window.onload != 'function'){
          
        window.onload           = func;
          
    }          else{
          
        window.onload           = function(){
          
            oldonload();
          
            func();
          
        }
          
    }
          
}
          
          function checkText(){
          
              var textId = document.getElementById('test');
          
        //設置文本框中的字體顏色為灰色
          
        document.getElementById('test').style.color='#C0C0C0';
          
              var textDefault = '中文';
          
              function cls(){
          
                  if (this.value == textDefault){
          
                      this.value = '';
          
        }
          
    }
          
              function res(){
          
                  if (this.value == ''){
          
                      this.value = textDefault;
          
        }
          
    }
          
    textId.onfocus           = cls;
          
    textId.onblur           = res;
          
}
          
addLoadEvent (checkText);
          
          </script>
          
          <body>
          
          <input type="text" id="test" value="中文" />
          
          </body>
          
          </html>
          

          

		
          
			posted on 2009-04-23 11:50 MikyTan 閱讀(13377) 評論(3)  編輯  收藏  
		
          
	
          
	
	


	


          
	    
    


          

          評論
          
	
	
			
          
				# re: jQuery實現input文本框內灰色提示文本效果 和  input標簽獲取焦點是文本框內提示信息清空 
					
						2014-01-22 10:26
					
				劉德
			
          
			
          
				12  回復  更多評論
				  
			
          
		
			
          
				# re: jQuery實現input文本框內灰色提示文本效果 和  input標簽獲取焦點是文本框內提示信息清空 
					
						2014-05-19 10:33
					
				收到伐大方
			
          
			
          
				ASF阿斯頓發  回復  更多評論
				  
			
          
		
			
          
				# re: jQuery實現input文本框內灰色提示文本效果 和  input標簽獲取焦點是文本框內提示信息清空 
					
						2015-05-28 11:58
					
				的認同感
			
          
			
          
				 復合肥  回復  更多評論
				  
			
          
		

          




          





          


          

	
          
		
          
				
		
	
		
          
		
		
          只有注冊用戶登錄后才能發表評論。
          
		
          
			
		
          
			
		
          
		
		
          
		


          

		          		
		
          
		
          			
		
		
		
		
          
		
          
		
		
          
		
          
			網站導航:
		
		
          
		
          
			
		
          	
		
          
			 
		
          
		
          
			
		
          
		
          
			
				
		
          		
	
          	

          



          

				

          



    







          
        
	




主站蜘蛛池模板：
句容市|
华容县|
施秉县|
台中市|
鹤庆县|
西安市|
新蔡县|
汪清县|
广州市|
瓮安县|
宁河县|
朔州市|
常德市|
新乡市|
岳阳县|
丽水市|
博客|
庆元县|
兴隆县|
微博|
翁源县|
绥芬河市|
乡宁县|
丰都县|
天长市|
鄂托克旗|
同心县|
鄂州市|
太原市|
嘉祥县|
葵青区|
东乡|
平顶山市|
方正县|
瑞昌市|
建阳市|
莲花县|
泗洪县|
通河县|
临西县|
应用必备|