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

显示和隐藏输入密码

作者: 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