js动态实现密码输入框与文本输入框的切换

/* 密码输入框 */ var tx = document.getElementById("tx"), pwd = document .getElementById("pwd"); tx.onfocus = function() { if (this.value != "请输入密码"){ return; }else{ this.select();

} } tx.onclick=function(){ this.style.display = "none"; pwd.style.display = ""; pwd.value = ""; pwd.focus(); } pwd.onblur = function() { if (this.value != "") return; this.style.display = "none"; tx.style.display = ""; tx.value = "请输入密码"; }

if (!!window.attachEvent && navigator.userAgent.match(/msie (\d)/i)[1] > 8){ document.attachEvent("onkeydown", function() { var key ; if(window.event) // IE { key = event.keyCode } else if(event.which) // Netscape/Firefox/Opera { key = event.which } if (key == 8) { if (pwd.value.length <= 1) { pwd.style.display = "none"; tx.style.display = ""; tx.value = "请输入密码"; var elem = window.event.srcElement; var name = elem.nodeName; if (name != 'INPUT') { event.returnValue = false; return; } var type_e = elem.type.toUpperCase(); if (name == 'INPUT') { event.returnValue = false; return; } } else { return; } }else{ return; } }); }

<input id="tx" name="" type="text" value="请输入密码" onMouseOver="this.onfocus()" onMouseOut="if(this.value=='')this.value='请输入密码';" />
<input id="pwd"name="" type="password" style="display: none"/>