想实现一个登录界面常用的效果：点击按钮后切换input框的显示/隐藏密码
首先想到的是，在按钮的点击事件里调用focus()使input获得焦点，代码如下：
显示/隐藏
var isExposed=false;
var btn=document.getElementById('btn');
var psw=document.getElementById('psw');
btn.οnclick=function(){
psw.focus();
if (isExposed) {
//切换为隐藏
psw.type='password';
isExposed=false;
}else{
//切换为显示
psw.type='text';
isExposed=true;
}
}
可这样做的效果是input失去焦点后又马上获得，效果不理想。
于是使用第二种方法，在按钮的onmousedown事件中阻止默认事件，代码如下：
显示/隐藏
var isExposed=false;
var btn=document.getElementById('btn');
var psw=document.getElementById('psw');
btn.οnclick=function(){
if (isExposed) {
//切换为隐藏
psw.type='password';
isExposed=false;
}else{
//切换为显示
psw.type='text';
isExposed=true;
}
}
btn.οnmοusedοwn=function(e){
//现代浏览器阻止默认事件
if ( e && e.preventDefault )
e.preventDefault();
//IE阻止默认事件
else
window.event.returnValue = false;
return false;
}
ok 成功实现效果~ :D
