Layui(十四) Layui 密码框设置明文/密文

目的:

 Layui(十四) Layui 密码框设置明文/密文_第1张图片Layui(十四) Layui 密码框设置明文/密文_第2张图片

过程:

        1、CSS代码

       2、layui 的部分HTML 代码

        3、JS代码

//隐藏text block,显示password block
    var demoImg = document.getElementById("img");
    var PWD = document.getElementById("LAY-user-login-password");

    function hideShowPsw() {
        if (PWD.type == "password") {
            PWD.type = "text";
            demoImg.src = "../layui/images/icon-invisible.png"; //图片路径(闭眼图片)
        } else {
            PWD.type = "password";
            demoImg.src = "../layui/images/icon-visible.png"; // 图片路径(睁眼图片)

        }
    }

    4、附上两张图片

                    

你可能感兴趣的:(layui)