文本框默认提示灰色，点击后输入黑色

最新推荐文章于 2023-01-30 11:31:53 发布

golden_fighter

最新推荐文章于 2023-01-30 11:31:53 发布

阅读量8.2k

点赞数 1

分类专栏：前台页面常见应用笔记文章标签： javascript input 手机 jsp html

本文链接：https://blog.csdn.net/amber_tear/article/details/7702785

版权

前台页面常见应用笔记专栏收录该内容

7 篇文章 0 订阅

订阅专栏

在前台页面应用中，我们在登录窗口等text框中，常常会碰到点击效果的的实现。下面实现的方式很简单也是比较常用的
* 默认灰色，点击后输入黑色。
<html>
    <head>
        <title>输入框效果实现</title>
    </head>
    <body>
         <input type="text" value="请输入" style="color='ccc'" onClick="this.style.color='black';this.value='';" onBlur="this.style.color=''">
     </body>
</html>

例如：在jsp页面中我这样使用
<input type="text" id="loginuserid" name="bean.id" maxlength="40"
   value="用户名/邮箱/手机"
   οnclick="javascript:if(this.value=='用户名/邮箱/手机'){this.value='';this.style.color='#000'}"
   οnblur="javascript:if(this.value==''){this.value='用户名/邮箱/手机';this.style.color='#999'} "
    onKeyDown="javascript:if(event.keyCode==13) return submitLoginForm();">

然后效果如下图：

点击后输入则如下：

golden_fighter

关注

1
点赞
踩
8

收藏

觉得还不错? 一键收藏
3
评论
文本框默认提示灰色，点击后输入黑色

在前台页面应用中，我们在登录窗口等text框中，常常会碰到点击效果的的实现。下面实现的方式很简单也是比较常用的* 默认灰色，点击后输入黑色。输入框效果实现例如：在jsp页面中我这样使用 value="用户名/邮箱/手机" onclick="javascript:if
复制链接

扫一扫

专栏目录