<HTML> 给input文本框中添加灰色提示字

最新推荐文章于 2024-04-30 17:59:49 发布
最新推荐文章于 2024-04-30 17:59:49 发布
阅读量4.4w 收藏 10
点赞数 4
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qiaolong/article/details/54899108
版权

很多网站的文本框都有灰色提文字，一点即消失，鼠标移开又出现! 用HTML5 中的新属性placeholder实现。

 将这段代码加载input中! 带js代码

<input type="text" placeholder="要显示的文字">

写个小demo大家测试下:

window.οnlοad=function() {
      $("input[placeholder=请输入密码]").hover(
            function() {
                $(this).bind("focus", function() {
                    $(this).attr("placeholder","");
                });
            },    
            function() {
                $(this).bind("blur", function() {
                    $(this).attr("placeholder","请输入密码");
                });
            }
        );
     
  }

Stephen-Q
关注
  • 4
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML5的input框placeholder提示文字默认为灰色，修改
majingjing1314的博客
07-23 2845
&lt;input type="text" value="请输入您需要查找的内容 …" onfocus="this.style.color='#fff';this.value='';" style="color: #fff;" class="form-control"/&gt;  
html代码文本框限制输入 文本框变灰色 限制文本框输入
09-28
主要介绍了html代码文本框限制输入、文本框变灰色、限制文本框输入,需要的朋友可以参考下
HTML中input输入框（详解输入框的用法）
百赢出品，必属精品
04-30 8418
input>元素是HTML表单中最常见的元素之一，用于收集用户的输入数据。它可以包含多种类型的输入，如文本、密码、数字等。通过指定不同的type属性，可以定义不同类型的输入字段。类型（type）属性定义输入字段的类型，如文本框、密码框、单选按钮、复选框等。常见类型包括textpasswordradiocheckboxfile等。名称（name）属性用于标识输入字段的名称，以便在表单提交时能够将数据传输到服务器。对于单选按钮和复选框，相同名称的一组按钮被视为一个组，只能选择其中的一个或多个。
在html中怎么在输入框中加入灰色提示,給input文本框添加灰色提示文字
weixin_32334251的博客
06-02 2187
用戶ID：// 文本框清空灰色提示function TextOnFocusShow(showId){var showIdTextValue = document.getElementById(showId).value;var showIdTextDeValue = document.getElementById(showId).defaultValue;// text初始設置if(showIdT...
php输入框显示灰色,JS实现输入框内灰色文字提示
weixin_39827036的博客
03-25 244
这次给大家带来JS实现输入框内灰色文字提示，JS实现输入框内灰色文字提示的注意事项有哪些，下面就是实战案例，一起来看一下。如何通过js实现html的placeholder属性效果呢我们需要这样做：JS实现placeholder属性效果function bl(){var a=document.getElementById("inpt");if(a.value.length<=0){a.styl...
输入框里默认的文字为灰色
weixin_30547797的博客
09-14 622
Code<style>html,body{margin:200px400px;}#search{color:#aaa;border:1pxsolid#CC0000;padding:1px;}</style></head><body><inputtype="text"value="请输入关键字"id="...
HTML5搜索框灰色提示字、关键词
m0_52173534的博客
05-31 2558
关于搜索框灰色字体聚焦是消失，失去焦点是出现，不影响搜索案例 搜索框灰色提示字，如图所示： 代码如下： html代码 <body> <div class="box"> <input type="text" value="手机"> </div> <script> //获取元素 var input = document.querySelector('input'); //聚焦时 搜索框中内容自动消失,字体颜色加深
jQuery简单实现input文本框内灰色提示文本效果的方法
10-23
主要介绍了jQuery简单实现input文本框内灰色提示文本效果的方法,涉及jQuery针对页面元素的遍历与样式动态操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
常用input文本框内容自动垂直居中并默认提示文字单击为空
12-08
1、内容自动垂直居中 2、默认提示文字显示灰色 3、单击后变为空 复制代码代码如下: <input type=”text” name=”wd1″ id=”qy_1″ maxlength=”100″ style=”color:gray;width:199px;height:30px;line-height...
html中实现文本框出现提示功能的多种方法
09-28
在HTML中实现文本框出现提示功能是网页设计中常见的需求，主要是为了给用户提供输入提示，让他们明白该输入什么内容。本文将详细介绍两种常用的方法：HTML5的`placeholder`属性和结合JavaScript与CSS来实现。 首先...
限制html文本框input只能输入数字和小数点
11-30
input type="text" class="txt" name="qty" value="" onkeyup="this.value=this.value.replace(/[^0-9\.]/g,'')" /> PS：js实现只能输入数字和小数点的文本框 <html><head><meta ...
html表单灰色字,灰色HTML表单元素
weixin_33683833的博客
06-07 354
我想让用户选择一个“行”用于提交报告类型的请求。如何将单选按钮放在表格的第一列中，并且选择哪一个是通过提交按钮发送到下一页的活动行？灰色HTML表单元素Please select your search criteriaSingle Date:DateInput('orderdate', true, 'DD-MON-YYYY')Date Range:Start DateEnd DateDateIn...
给input文本框添加灰色提示文字
世范水晶
01-04 1139
灰色提示功能 大家都见到很多网站的文本框都有灰色提文字，一点即消失，鼠标一开又出现（没填写状态下）用下面这段短短的代码就可以实现啦！将这段代码加载input 中！ value="你的提示文字" onFocus="if(value==defaultValue){value='';this.style.color='#000'}" onBlur="if(!value){value=defaul...
给input文本框添加灰色提示文字,三种方法.
weixin_30491641的博客
12-21 847
1.这个是HTML5的属性. h5的好简单.... placeholder="这里输入文字" 2.HTML的: value="你的提示文字" onFocus="if(value==defaultValue){value='';this.style.color='#000'}" onBlur="if(!value){value=defaultValue;this.style.color=...
给input文本框添加灰色提示文字两种方法.
iSuperGifted的博客
06-24 8052
1. HTML5的属性.placeholder="这里输入文字"2. jsvalue="你的提示文字" onFocus="if(value==defaultValue){value='';this.style.color='#000'}" onBlur="if(!value){value=defaultValue;this.style.color='#999'}" style="color:#99...
html文本框灰色提示字,给<input>文本框添加灰色提示文字
weixin_42551508的博客
06-03 1186
Xcode 属性面板添加自定义控件属性让自定义控件像原生控件一样可以在属性面板配置参数,Apple文档传送 直接上效果图,根据Xamarin笔记Xamarin学习笔记 1. Xamarin Studio自动更新下载的安装文件缓存路径:C:\Users\登录用户\AppData\Local\XamarinStudio-5.0\Cache\Tem ...剑指Offer面试题：8&period;...
html下拉框默认选中灰色,select默认选中项颜色为灰色，选择后变为黑色（js实现）...
weixin_39863631的博客
06-05 1781
var unSelected = "#999";var selected = "#333";$(function () {$("select").css("color", unSelected);$("option").css("color", selected);$("select").change(function () {var selItem = $(this).val();if (sel...
html文本框里面文字颜色怎么改,如何修改输入框placeholder文字默认颜色
weixin_29790897的博客
06-03 4226
input-placeholderhtml5为input添加了原生的占位符属性placeholder，高级浏览器都支持这个属性，例如：默认的placeholder字体颜色是呈浅灰色，如果想改变这个默认颜色，解决方案如下：input:-moz-placeholder,textarea:-moz-placeholder {color: #999;}input:-ms-input-placeholder...
html文本框设置默认值,HTML input文本框设置和移除默认值
weixin_29081101的博客
06-03 6358
这里想实现的效果是：设置和移除文本框默认值，如下图鼠标放到文本框中的时候，灰字消失。1.可以用简单的方式，就是给input文本框加上onfocus属性，如下代码：onfocus='if(this.value=="请输入关键字进行搜索"){this.value="";}; 'onblur='if(this.value==""){this.value="请输入关键字进行搜索";};'>其实onf...
1. (简答题) 该页面由<input>标签中的文本框、密码框和提交按钮控件，以及<div>块元素、<ul>无序列表、<a>超链接、<img>图像标签、<p>段落标签和<span>内联元素构成。
最新发布
05-29
1. 该页面由一些常见的HTML标签构成，包括<input>标签中的文本框、密码框和提交按钮控件，以及<div>块元素、<ul>无序列表、<a>超链接、<img>图像标签、<p>段落标签和<span>内联元素等。这些标签都是HTML语言中的基本元素，可以通过它们来构建出具有结构和样式的网页。其中，<input>标签用于创建表单控件，如文本框、密码框和提交按钮；<div>标签用于将页面分割成不同的块；<ul>标签用于创建无序列表；<a>标签用于创建超链接；<img>标签用于插入图片；<p>标签用于创建段落；<span>标签用于定义内联元素等。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值