input密码可见切换

最新推荐文章于 2025-06-10 10:44:35 发布

#秃头小牛

最新推荐文章于 2025-06-10 10:44:35 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： javascript vue.js elementui

本文链接：https://blog.csdn.net/qq_46015513/article/details/122991118

javascript 专栏收录该内容

28 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了如何使用三元表达式来优化JavaScript和Vue.js中input密码框的可见性切换功能，结合ElementUI组件库，提升代码效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >


        button {
            background-color: pink;
            border-radius: 10px;
        }
        input {
            border-radius: 10px;
            height: 20px;
        }


    <input type="password">
    <button>显示密码</button>

            // 获取元素
        var inpu = document.querySelector('input') // 获取input框
        var butt = document.querySelector('button') // 点击按钮
        // 设置点击事件
        butt.onclick = function () {
            // console.log(123)
            // 获取type属性
            var i = inpu.type
            // console.log(i) // 运行结果：password

            // if判断
            // if(i === 'password'){
            //     inpu.type = 'text'
            // } else {
            //     inpu.type = 'password'

了解本专栏