js实现默认文本框信息 鼠标点击时没有离开时显示

 <style type="text/css">
        #tb
        {
            border:1px solid #0094ff;
            margin:5px auto;
            border-collapse:collapse;/*是指让行和列的边框相融合*/
        }
        tr
        {
            border:1px solid#0094ff;
            margin:5px;
            text-align:center;
            padding:4px;
        }
        td
        {
            border:0px solid#0094ff;
            margin:5px;
        }
    </style>
    <script type="text/javascript">
        var text = document.createElement("input");//创建一个文本框
        text.type = "text";
        var text1 = document.createElement("input");//创建一个文本框
        text1.type = "text";
        window.onload = function () {
            var tb = document.getElementById("tb");
            var tbrow = tb.insertRow(0);//创建第一行
            var tbrow1 = tb.insertRow(1);//创建第二行
            tbrow.insertCell(-1).innerHTML = "通行证账号:";
            text.value= "如: name@example.com"; //文本框赋值用Value 节点赋值用innerHTML
            tbrow.appendChild(text);//把文本框添加到行节点中
            text.onclick = textonclick;
            tbrow1.insertCell(-1).innerHTML = "验证码:";
            text1.value = "";
            tbrow1.appendChild(text1);
        }
        function textonclick() {
            text.value = "";
            text.focus();
        }

        text.onblur = function () {
            text.value = "如: name@example.com";
        }
    </script>
</head>
<body>
    <table id="tb">
    </table>
</body>

posted @   逊老头  阅读(369)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示