input文本框 鼠标点击默认值消失,不输入离开鼠标恢复默认值

最新推荐文章于 2017-03-03 16:33:00 发布
原创 最新推荐文章于 2017-03-03 16:33:00 发布 · 1w 阅读 · 6 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文详细介绍了如何使用HTML和JavaScript实现input文本框在聚焦时清空默认值并在失焦时恢复默认值的功能，同时讨论了强制兼容性的解决方法。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >





input文本框 鼠标点击默认值消失,不输入离开鼠标恢复默认值


1.input:


<inputname="textfield"type="text"value="点击添入标题"onfocus="if (value =='点击添入标题'){value =''}"onblur="if (value ==''){value='点击添入标题'}"/>


2textarea:


<textareaname="textarea"cols="80"rows="17"onfocus="if(value=='正文：'){value=''}"onblur="if (value ==''){value='正文：'}"></textarea>


强制兼容：


<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
js实现input文本框点击时文字消失，失去焦点时文字出现
04-14
NULL 博文链接：https://luanxiyuan.iteye.com/blog/1744279
JS清除文本框内容离开在恢复及鼠标离开文本框时触发js的方法
10-22
但当用户点击这个文本框后，我们希望默认提示文本被清空，以便用户可以输入自己的信息。当用户输入的内容被删除后，如果文本框失去焦点，我们希望默认提示文本能够重新显示。这种交互行为能够为用户提供一个清晰的...
input输入框默认文字，点击消失
weixin_34356138的博客
05-20 1021
经过查询，发现2种实现方式： 1. &lt;input type="text" value="请输入用户名" onfocus="if(value=='请输入用户名') {value=''}" onblur="if (value=='') {value='请输入用户名'}"&gt; 直接在input中定义onfocus和onblur事件，缺点：鼠标一离开就显示提示文字,输入框中用户的输入也...
输入框默认文字，点击消失。
weixin_33953249的博客
05-24 208
<inputtype="text"value="请输入用户名"onfocus="if(value=='请输入用户名'){value=''}"onblur="if(value==''){value='请输入用户名'}"> 转载于:https://www.cnblogs.com/CB/archive/2008/05/24/1206495.html...
文本框默认值 单击后自动消失
司刚军的个人专栏
03-27 1752
var s=document.getElementById("s"); s.onfocus=function(){ if(this.value==this.defaultValue) this.value='' }; s.onblur=function (){ if(/^\s*$/.test(this.value)){ this.value=this.defaultValue; t
点击input默认值消失
生活在爪洼岛上
04-27 495
&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;index.html&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;in
JS实现input文本框点击清空及失去焦点恢复默认值
"js实现input文本框点击时文字消失，失去焦点" 在网页设计中，我们经常需要对用户交互进行定制，比如当用户点击输入框时，预设的文字（如“请输入姓名”）应该消失，让用户能够开始输入自己的内容。而当用户离开这...
jQuery响应鼠标事件并隐藏与显示input默认值
10-25
当用户点击（获得焦点）input元素时，如果当前的值与默认值相同（即用户尚未输入任何内容），则清空该元素的值，从而使默认提示文字消失；而当用户离开（失去焦点）该元素时，如果input元素为空，则将默认值重新填充...
JS文本框默认值处理详解
10-27
JS文本框默认值处理是前端开发中常见的一种需求，它涉及到在用户与页面进行交互时，对文本框的初始内容进行动态调整，以提升用户体验。在这篇文章中，我们将详细解释如何使用JavaScript来处理文本框的默认值。 首先...
文本框设置默认值和验证提交
11-11
为提供更好的用户体验和数据完整性，我们需要对文本框进行默认值的设置以及提交时的数据验证。本文将详细讲解这两个关键点。 一、文本框设置默认值 文本框的默认值可以通过HTML属性`value`来设定。例如，如果我们...
input标签，输入内容后默认值消失实现方法
localhost
09-23 1566
[code="html"][/code]
鼠标点击input框后里面的内容就消失
weixin_34313182的博客
03-03 2182
<!DOCTYPE html><html> 　　<head> 　　　　<meta charset="UTF-8"> 　　　　<title>鼠标点击input框后里面的内容就消失</title> 　　</head> 　　<body> 　　　　<input type="text" size=...
输入框默认文字点击消失
aitcax的专栏
11-06 1554
使用javascript完成： 代码：
【前端JS】input textarea 默认文字，点击消失
千山牧雪的专栏
06-11 5877
实现 input textarea 默认浅色提示文字，点击消失
输入框未输入时，显示默认值，当鼠标点击这个输入框时默认值消失
jiangzh1982的专栏
03-20 1161
  &lt;ww:textfield name="searchresource" size="5" onfocus="this.value=''" value="资源搜索"/&gt;   通过使用onfocus="this.value=''"，对这个效果进行设定
HTML5里的placeholder属性
11-05 1492
HTML5里新引入很多有趣的新特征；有些体现在HTML里，有些是JavaScript API，全部非常的有用。其中我最喜欢的一个特征就是文本框(INPUT)里的placeholder属性。placeholder属性能够让你在文本框里显示提示信息，一旦你在文本框里输入了什么信息，提示信息就会隐藏。你以前可能无数次看到这种效果，但那些大部分是用JavaScript里实现的，而现在，HTML5提供了原生
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值