JS 显示隐藏文本框的内容

揭开画皮

于 2024-05-23 10:19:28 发布

阅读量179

点赞数 1

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/m0_75166176/article/details/139140532

版权

<body>
    <input type="text" value="你没有点我">
    <script>
         // 1.获取元素
         var text = document.querySelector('input');
         text.style.color = '#999';
         // 2.注册事件，获取焦点事件
         text.onfocus = function(){
             if(text.value === '你没有点我'){
            text.value = ''; //让输入框的文字消失
            this.style.color = '#000';
              }
         }
         // 3.注册事件，失去焦点事件
         text.onblur  =function(){
            if(text.value === ''){
               text.value = '你没有点我'; //让输入框的文字显示
               text.style.color = '#999';
            }
        }
    </script>
</body>