DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JS實現密碼框根據焦點的獲取與失去控制文字的消失與顯示效果
JS實現密碼框根據焦點的獲取與失去控制文字的消失與顯示效果
編輯:關於JavaScript     

本文實例講述了JS實現密碼框根據焦點的獲取與失去控制文字的消失與顯示效果。分享給大家供大家參考,具體如下:

思路:

1、首先用把密碼框用txt暫時替代,並賦上默認值 <input type="text" value="請輸入密碼" />
2、當文本框獲取焦點後,把默認值清空,把type改為password。
3、當文本框失去焦點後,把type改為txt,把默認值設為“請輸入密碼”。

JS代碼:

window.onload=function(){
  var input=document.getElementById('input');
  input.onfocus=function(){
    if(this.value=='請輸入密碼'){
      this.value='';
      this.type='password';
    };
  };
  input.onblur=function(){
    if(!this.value){
      this.type = 'text';
      this.value = '請輸入密碼';
    };
  };
};

HTML代碼
復制代碼 代碼如下:
<input type="text" value="請輸入密碼" id="input" />

PS:這裡再為大家推薦一款非常好用的JavaScript壓縮、格式化與加密工具,功能非常強大(對於想讓代碼加密的朋友不妨試試這裡的js加密功能):

JavaScript壓縮/格式化/加密工具:http://tools.jb51.net/code/jscompress

另外,上面這款js工具中的加密使用的是eval函數加密形式,對此本站還提供了如下這款針對eval函數加密的解密工具,非常強大實用!

js的eval方法在線加密解密工具:http://tools.jb51.net/password/evalencode

希望本文所述對大家JavaScript程序設計有所幫助。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved