文字 INPUT欄位預設文字點擊消失JS效果

表格中經常會運用表格預設文字，方便提醒訪客輸入。例如搜尋欄預設文字就是最常見到的運用之一。


如何透過JS實踐點擊清除預設文字，方法如下：

HTML 輸入欄代碼部分

1. <input type="text" name="tt" id="tt" class="t1" value="自定義預設文字" onfocus="cleartext(this)" onblur="resettext(this)"/>
   

複製代碼

備註：先寫onfocus, 再寫onblur

JS 功能函數撰寫部分

1. <script type="text/javascript">
   
2. function resettext(id){
   
3.            //恢復文字
   
4.            if(id.value == "")
   
5.            {
   
6.                    id.value = id.defaultValue;
   
7.            id.className ="t1";   
   
8.            }
   
9.                      }
   
10. function cleartext (id){
    
11.           //清除文字
    
12.           id.value ="";
    
13.       d.className ="";   
    
14.           }
    
15. </script>

複製代碼

lihiuwa

謝謝你的分享