第一、首先准备两张眼睛的照片,例如下图(也可以去找自己喜欢的)

javascript密码 安全吗 js设置密码的代码_js

javascript密码 安全吗 js设置密码的代码_input标签_02

第二、Html样式:

<div class="see">
<img src="~/Condent/img/openeye.png" id="openEye" style="display:none;" />
<img src="~/Condent/img/closeeye.png" alt="隐藏密码" id="closeEye" />
</div>

第三、js代码

//------------------登录页面密码长按显示或隐藏--------------------
        //鼠标松开时密码隐藏
        $("#openEye").mouseup(function () {
            //修改input标签的类型
            $("#userPassword2").attr("type", "password");
            //显示密码的图片隐藏
            $("#openEye").hide();
            //隐藏密码的图片显示
            $("#closeEye").show();
        });
        //鼠标按下时密码显示
        $("#closeEye").mousedown(function () {
            //修改input标签的类型
            $("#userPassword2").attr("type", "text");
            //隐藏密码的图片显示
            $("#closeEye").hide();
            //显示密码的图片隐藏
            $("#openEye").show();
        });
        //鼠标移出时,密码隐藏
        $("#openEye").mousemove(function () {
            //修改input标签的类型
            $("#userPassword2").attr("type", "password");
            $("#openEye").hide();
            $("#closeEye").show();
        });

最后:长按眼睛的图片就会显示密码了

这是我所学到的一些知识,在此分享给大家,希望可以帮助到你们。

以上就是我的分享,新手上道,请多多指教。如果有更好的方法或不懂得地方欢迎在评论区教导和提问喔!