jq改变input的type属性实现密码显示隐藏的切换

一般我们做登录注册的时候都会提供一个让用户选择自己输入的密码是否显示的需求,
这种需求我们肯定会想到只要动态改变input的type属性不就好了(text显示/password隐藏):
于是我用了$(''#id).attr('type', 'password')这个API 然而结果并不是我想的那样,出错了

HTML 代码

1
Uncaught Error: type property can't be changed

意思大概就是这个属性不能被修改.
于是我就googl一手.
然而我得到的结果是这样的
HTML 代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
< input   id = "showPwd"   class = "txt"   type = "text"   value = ""   tabindex = "2"   />   
< input   id = "pwd"   class = "txt"   name = "password"   type = "password"   />  
var showPwd = $("#showPwd"), pwd = $("#pwd");  
showPwd.focus(function(){  
   pwd.show().focus();  
   showPwd.hide();  
});  
  
pwd.blur(function(){  
   if(pwd.val()=="") {  
        showPwd.show();  
        pwd.hide();  
    }  
});  

大体上都是这种办法,简单来说就是用两个input来回切换着显示,互相获取对方输入的字符!
这种办法我试了一手,可以实现,而且代码也不是很多。但是我总觉得怪怪的,这种需求应该这么实现?肯定不可能啊
一般这种情况我都会去看看大厂是不是这么做的,而且某些大厂并不是这么做的!
但是Google都搜不到我的问题,应该是没有解决办法了吧!
最后....
$(''#id).prop('type', 'password') 可以修改,卒~~

你可能感兴趣的:(jq改变input的type属性实现密码显示隐藏的切换)