JS實作密碼框根據焦點的取得與失去控製文字的消失與顯示效果_javascript技巧

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

思路：

1.先用密碼框用txt暫時取代，並賦上預設值
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程式碼：

複製程式碼 程式碼如下:

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

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

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

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

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