html中input文本框，初始里边有文字提示，当点击输入文字时，原文字消失

最新推荐文章于 2024-02-19 09:22:56 发布
最新推荐文章于 2024-02-19 09:22:56 发布
阅读量1.2w 收藏 6
点赞数 6
分类专栏： 平时随笔 html 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_38035006/article/details/77982284
版权

方法一：

使用onfocus事件检查当前值,如果是默认值,就将value属性置空.如:
<input type="text" value="请输入内容" οnfοcus="javascript:if(this.value=='请输入内容')this.value='';">

方法二：

<input id="email" type="text" placeholder="这里输入文字" size="22" />

 placeholder="这里输入文字"

YH_9339
关注
  • 6
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
js实现input文本框点击时文字消失，失去焦点时文字出现
04-14
NULL 博文链接：https://luanxiyuan.iteye.com/blog/1744279
使一个input文本框随其中内容而变化长度的方法
12-14
第一: 复制代码代码如下: &lt;input type=”text” onkeydown=”this.onkeyup();” onkeyup=”this.size=(this.value.length&gt;4?this.value.length:4);” size=”4″> 其中 size="4"就是定义初始的大小,如果这里没有定义,那就把this.size=(this.value.length>4?this.value.length:4);里面的4改成20,&lt;input type="text"&gt;的默认size就是20 第二: 如果你在style里定义了width属性,又要让它的width根据内
html中如何给input输入框这个一个默认值
最新发布
Dxy1239310216的博客
02-19 1213
用户可以在这个输入框中编辑或删除这个默认值，并且当表单提交时，将发送用户输入或修改后的值（如果输入框为空，则不发送任何值）。，这意味着当页面加载时，这个输入框将显示“这是默认值”这个文本。输入框设置一个默认值，你可以使用。，表示这是一个文本输入框。
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
10-16
主要介绍了jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能,涉及jQuery事件响应及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下
html输入框点击透明度,点击输入框无法中间修改编辑和遮罩层无法覆盖文字问题（二）...
weixin_42519253的博客
06-07 410
小程序在开发过程中，输入框的应用需求越来越普遍，那么在使用它的时候有什么坑呢？一、有某个场景，需要设置input和textarea组件的初始值，所以，我将value属性设置为初始值。然后，在编辑文字的过程中，如果我将光标移到文字中间某个位置，然后进行删除或插入文字的操作，光标会立即跳转到输入框的最后，非常影响编辑的体验。在真机测试中有这个问题，而模拟器中没有！请问这个问题如何解决？(部分手机：苹果...
键盘调出时将输入框覆盖
zhenxi_20的专栏
06-19 537
当键盘调出时将输入框覆盖时，可以用下方法： - (BOOL)textFieldShouldBeginEditing:(UITextField *)textField { [self.view setFrame:CGRectMake(0, -100, 320, 480) ]; return YES; } - (BOOL)textFieldShouldEndEdit
html中input文本框，初始里边有文字提示，当点击时，文字消失，怎么设置？
weixin_30539625的博客
09-29 2193
使用onfocus事件检查当前值,如果是默认值,就将value属性置空.如:<input type="text" value="请输入内容" onfocus="javascript:if(this.value=='请输入内容')this.value='';"> 转载于:https://www.cnblogs.com/ch-zaizai/p/5919365.html...
文档或编程过程中在前面打字会把后面的文字覆盖掉解决办法
weixin_46941961的博客
01-11 2949
那是无意间按下了键盘上的【Insert】键，因此进入了改写模式，会导致写一个字覆盖掉前面的字。 只需要按一下键盘上【Insert】键，将改写状态切换回插入插入状态即可
如何让input文本框里的文字提示在鼠标点击后（或输入文字后）消失？
webdowhatIlike的博客
10-22 1041
➕placeholder：“请输入……”
文本框默认显示内容点击后消失的方法
Bonnie的专栏
12-09 6076
点击文本框后默认文字消失，焦点离开输入框默认文字又出现。 <INPUT TYPE="TEXT" size="18" value="默认内容"onfocus= "if (value =='这是默认的内容') {value =''}" onblur= "if (value=='') {value='这是默认的内容'}">
html输入框为什么不能粘贴,移动端input框type为number仍可以输入和粘贴【中文】的问题...
weixin_36460573的博客
06-08 1019
先这个问题非常棘手，因为这可能是浏览器的一个bug，当用户在type=number的input框输入中文时，这个值其实并不会被接收，但是有时会被展现。即：它会像普通值一样显示，但是双向绑定的参数接收不到中文值，一般为空字符串。_type=number会吊起数字键盘，很多产品设计倾向于此，但是目前来看各系统(浏览器)对此兼容并不好。这类输入一般来源于非标准输入或空input框聚焦时，哪怕是type=...
JS简单获取并修改input文本框内容的方法示例
12-10
本文实例讲述了JS简单获取并修改input文本框内容的方法。分享给大家供大家参考，具体如下： 一 介绍 获取文本框并修改其内容可以使用getElementById()方法来实现。 getElementById()方法可以通过指定的id来获取HTML...
autosize-input:精巧JavaScript中的动态宽度文本框
05-24
香草JavaScript中的动态宽度文本框，毫不费力。 动态调整文本框的宽度以适合其当前内容 可以初始化以适合其placeholder属性 （可选）根据元素的初始内容设置min-width 压缩718个字节 用法 < input type =" ...
HTML5&CSS3网页制作：Input元素的type属性.pptx
05-31
<input />元素是表单中最常见的元素，网页中常见的单行文本框、单选按钮、复选框等都是通过它定义的。 语法格式 <input type="控件类型" /> 说明 Input元素的type属性 02 单行文本框 描述 单行文本输入框常用来输入...
PDF电子发票解析成excel，支持批量解析和导出功能
热门推荐
m0_38035006的博客
12-07 1万+
PDF电子发票解析成excel，支持批量解析和导出功能 https://www.promiseblog.cn/tool/pdfParse https://www.promiseblog.cn 入口: 单张发票解析---解析步骤: 单张解析完成！ 接下来介绍批量解析： 查看导出的excel详情： 完美！...
JS延时函数，格1秒触发
m0_38035006的博客
09-19 1万+
setTimeout(function () {  $("#provideTime").css("background-color", "");     }, 1000);
文字超过div（或者input框等）宽度用省略号显示css
m0_38035006的博客
10-20 9451
input{     width: 50px;  /*必须设置宽度*/     overflow: hidden;  /*溢出隐藏*/     text-overflow: ellipsis; /*以省略号...显示*/     white-space: nowrap;  /*强制不换行*/ }
JAVA数组的扩容（逻辑上增加数组的长度）
m0_38035006的博客
09-04 7066
package com.yh.test; public class Test_1 { public static void main(String[] args) { int[] a = {1,2,3}; a = (int[])resizeArray(a,10); a[3] = 4; a[4] = 5; a[5] = 6; for (int i=0; i
设计如下所示的表单，当点击输入姓名时，后面有提示，若为英文请区分大小写
06-08
您可以使用以下代码实现带有姓名提示的表单： HTML代码： ``` <form> <label for="name">姓名：</label> <input type="text" id="name" onfocus="showNameTip()" onblur="hideNameTip()"> <div id="nameTip" style="display:none">请输入您的姓名，英文区分大小写</div> <br> <label for="age">年龄：</label> <input type="text" id="age"> <br> <input type="submit" value="提交"> </form> ``` JavaScript代码： ``` function showNameTip() { document.getElementById("nameTip").style.display = "block"; } function hideNameTip() { document.getElementById("nameTip").style.display = "none"; } ``` 在上面的代码中，我们使用了 `<label>` 标签来为文本框添加标签，使用 `onfocus` 和 `onblur` 事件来触发显示和隐藏提示信息的函数。提示信息使用了 `<div>` 标签，并设置了初始状态为不显示。 当用户点击文本框时，`showNameTip()` 函数将被触发，将提示信息的 `display` 样式设置为 `block`，从而显示提示信息。当用户离开文本框时，`hideNameTip()` 函数将被触发，将提示信息的 `display` 样式设置为 `none`，从而隐藏提示信息。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值