首页 > 代码库 > 设置密码是否为可见

设置密码是否为可见

技术分享
<html>
<head>
  <meta charset="utf-8">
  <title>密码明文</title>
  <script language="JavaScript">
  function demo(){
    var tp=document.all["passwd"];
    //tp.setAttribute("type","text");     //ok1
    //tp.type="text";           //ok2
    var rd=document.all["rd"];
    if(rd.checked){
        tp.type="text";
    }else{
        tp.type="password";
    }
  }
  </script>
</head>

<body>
<form>

<fieldset style="width:300px;margin-left:35%;margin-top:10%;">
    <legend >设置为可选明文密码</legend>
        <table>
            <tr>
                <td><label for="rd" onfocus="demo()">是否为明文</label></td>
                <td><input type="checkbox" id="rd" name="rd" onclick="demo()"/></td>
            </tr>
            <tr>
                <td>用户名:</td>
                <td><input type="text" id="username"/></td>
            </tr>
            <tr>
                <td>&nbsp;码:</td>
                <td><input type="password" id="passwd" name="passwd"/></td>
            </tr>
        </table>        
</fieldset>

</form>
</body>
</html>
源码
 1 <html>
 2 <head>
 3   <meta charset="utf-8">
 4   <title>密码明文</title>
 5   <script language="JavaScript">
 6   function demo(){
 7     var tp=document.all["passwd"];
 8     //tp.setAttribute("type","text");     //ok1
 9     //tp.type="text";           //ok2
10     var rd=document.all["rd"];
11     if(rd.checked){
12         tp.type="text";
13     }else{
14         tp.type="password";
15     }
16   }
17   </script>
18 </head>
19 
20 <body>
21 <form>
22 
23 <fieldset style="width:300px;margin-left:35%;margin-top:10%;">
24    <legend >设置为可选明文密码</legend>
25        <table>
26             <tr>
27                 <td><label for="rd" onfocus="demo()">是否为明文</label></td>
28                 <td><input type="checkbox" id="rd" name="rd" onclick="demo()"/></td>
29             </tr>
30             <tr>
31                 <td>用户名:</td>
32                 <td><input type="text" id="username"/></td>
33             </tr>
34             <tr>
35                 <td>&nbsp;码:</td>
36                 <td><input type="password" id="passwd" name="passwd"/></td>
37             </tr>
38        </table>        
39 </fieldset>
40 
41 </form>
42 </body>
43 </html>

 

设置密码是否为可见