美文网首页
显示和隐藏输入密码

显示和隐藏输入密码

作者: zkzhengmeng | 来源:发表于2019-07-23 09:42 被阅读0次
    <html>
        <head>
            <meta  charset="utf-8"/>
            <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>      
        </head>
        <body>
            <form name="formName">
                <input id="passwd" type="password" size="24" maxlength="17" style="ime-mode: disabled; display: inline;" />
                <input id="passwd2" type="text" size="24" maxlength="17" style="ime-mode: disabled; display: none;" />
                <input id="chk" type="checkbox" />显示密码
            </form>
            <script type="text/javascript">
                $(function() {
                    $("#chk").click(function() {
                            if($(this).attr("checked")) {
                                $("#passwd2").val($("#passwd").val());
                                $("#passwd").hide();
                                $("#passwd2").show();
                            } else {
                                $("#passwd").val($("#passwd2").val());
                                $("#passwd2").hide();
                                $("#passwd").show();
                            }           
                     });
                });
            </script>
        </body>
    
    </html>
    
    

    相关文章

      网友评论

          本文标题:显示和隐藏输入密码

          本文链接:https://www.haomeiwen.com/subject/okwnlctx.html