Dom 文本框提示文本

最新推荐文章于 2022-04-05 23:18:11 发布

Soloensiz

最新推荐文章于 2022-04-05 23:18:11 发布

阅读量731

点赞数 1

CC 4.0 BY-SA版权

分类专栏： web前端文章标签： dom web前端

本文链接：https://blog.youkuaiyun.com/Lu_1u/article/details/76099138

web前端专栏收录该内容

10 篇文章

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title></title>
    <style type="text/css">
        .gray-text{
            color:gray;
        }
    </style>
    <script type="text/javascript">
            window.onload = function () {
                var accountElement = document.getElementById("account");

                accountElement.onfocus = function () {
                    if(this.className == "gray-text"){
                        this.value = "";
                        this.className = null;
                    }
                }
                accountElement.onblur = function () {
                    if(!this.value){
                        this.value = "请输入账号";
                        this.className = "gray-text";
                    }
                }
            }
        </script>

</head>
<body>

<label>账号</label>
<input class="gray-text" type="text" id="account" value="请输入账号"/>
<input type="text" placeholder="请输入账号"/>


</body>
</html>