服務信箱：sr.design2011@gmail.com搜尋本網站

SR網頁設計工作室 - 購物網站/企業官網專業開發

搜索
SR網頁設計工作室 - 購物網站/企業官網專業開發 › JS程式語法 › 文字 INPUT欄位預設文字點擊消失JS效果

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

byadmin 發表於 2014-7-28 18:21:00 , 9406人已閱讀 , 1人回應
表格中經常會運用表格預設文字，方便提醒訪客輸入。例如搜尋欄預設文字就是最常見到的運用之一。
2014-07-28_181753.jpg

如何透過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>
複製代碼

收藏回覆 只看該作者 道具 舉報

bylihiuwa 發表於 2014-8-21 15:58:15
謝謝你的分享

回覆 只看該作者 道具 舉報

返回列表
Traffic Exchange Site
高級模式
B Color Image Link Quote Code Smilies
您需要登錄後才可以回帖 登錄 | 立即註冊

作者資訊

admin

文章分類

Contact us

歡迎您使用以下方式聯繫我們 , 本工作室服務時間為每日早上10:00點至晚間7:30點 ,也可點選下方 Contact us 進入留言板留下您的問題與相關聯絡資訊 , 我們將會儘快了解與回覆您。

SR數位設計工作室

  • 服務專線：03-3555-069


ECSHOP購物網站開發|接案說明|線上洽詢|隱私權政策|SR數位設計(CMS)

信箱：sr.design2011@gmail.com

本網站推薦使用以下瀏覽器 (請點擊圖式下載)

, Processed in 0.038507 second(s), 38 queries , Gzip On.

Copyright © 2011-2014 Template By SR網頁設計清新部落風格

Core - DZ2.5　GMT+8, 2024-12-4 16:49

回頂部