本文转载自：http://hi.baidu.com/anyongqiang/item/29c55dd5c32d0b94270ae775
有三种方法来实现，个人首选第三种
一、
<INPUT onblur="if (value ==''){value='输入文字'}" onclick="if(this.value=='输入文字')this.value=''" maxLength=40 size=16 value=输入文字 name=ss_name>
二、
此功能主要是给用户在搜索输入关键字的时候，给用户一个友好的提示。很实用的代码，主要是onclick(点击)和onblur(失去焦点)两个事件.具体代码如下：(注意：js代码要放到页面的最下面)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<body>
<form action="users.asp" method="post" name="so" id="so" style="margin:0 ">
<input name="values" type="text" id="values" size="15" maxlength="20" value="请输入用户名" style="color:#CCCCCC; ">
<input type="submit" name="Submit2" value="提交">
<input name="flag" type="hidden" id="flag" value="username">
</form>
</body>
</html>
<script language="JavaScript" type="text/javascript">
function addListener(element,e,fn){
if(element.addEventListener){
element.addEventListener(e,fn,false);
} else {
element.attachEvent("on" + e,fn);
}
}
var values = document.getElementById("values");
addListener(values,"click",function(){
values.value = "";
})
addListener(values,"blur",function(){
if (values.value ==''){values.value = "请输入用户名";}
})
</script>
三、
<html>
<head>
<script type="text/javascript">
//扩充String方法，使其具有trim()
String.prototype.trim = function()
{
return this.replace(/(^\s*)|(\s*$)/g, "");
}
function onClickt(inputObj){
var text='可消除空格，请输入空格'
inputObj.value = inputObj.value.trim();
inputObj.style.color = 'black';
if(inputObj.value==text)
{
inputObj.value='';
}
}
//当失去焦点时，调用onBlur()
function onBlur(inputObj){
inputObj.value = inputObj.value.trim();
if(inputObj.value=='')
{
inputObj.value='可消除空格，请输入空格';
inputObj.style.color = 'gray';
}
}
</script>
</head>
<body>
<input type="text" size="25" style="color: gray" value="可消除空格，请输入空格" id="input_search"
onclick="onClickt(this);" onblur="onBlur(this);" style="color: gray" />
</body>
</html>
相关推荐
通过上述代码和解析，我们可以清晰地了解到如何使用JavaScript实现`input`文本框点击时文字消失，失去焦点时文字重新出现的功能。这种技术不仅增强了网站的交互性和可用性，也为用户提供了更加直观的操作指南。...
### 文本框点击时文字消失失去焦点时文字出现 #### 背景介绍 在Web开发中，用户体验是至关重要的一个方面。一个优秀的用户界面能够极大地提升用户的满意度和产品的竞争力。其中，表单元素（如文本框）的设计与交互...
针对标题中提到的现象，通常在网页设计和前端开发领域，实现一个文本框在用户点击时清空文字内容，在文本框失去焦点时重新显示预设文字的功能，主要是使用JavaScript（JS）和HTML中的input元素以及可能的一些CSS样式...
在这个特定的场景中，我们关注的是如何使用jQuery来实现一个功能：当文本框（input[type="text"]）获取焦点时，其预设的文字自动消失，而当失去焦点时，文字又能重新出现。这个功能常见于搜索框或表单输入，以引导...
先来看javascript的直接写在了input上 代码如下: <input name=”pwuser” type=”text” id=”pwuser” class=”input” value=”楼盘账号” onBlur=”if(this.value==”) this.value=’楼盘账号’;” onFocus=”...
而当文本框失去焦点（用户点击其他地方或切换到其他文本框）时，提示文字又应该重新出现。这种交互方式提高了用户体验，因为它在需要时为用户提供指导，同时在用户开始输入时不会干扰视线。 在Web开发中，我们通常...
本文将围绕“JQ文本框得到失去焦点”这一主题进行详细讲解，帮助开发者理解如何利用jQuery来监听文本框（input[type="text"]）的聚焦（focus）和失焦（blur）事件。 ### 一、jQuery基本概念 jQuery库通过$函数提供...
标题中提及的"js实现鼠标点击文本框自动选中内容的方法"主要涉及到的是JavaScript编程语言中的两个概念：鼠标点击事件（onClick）和文本选择事件（select）。在Web开发中，页面上的文本框（input type="text"）或者...
本文将详细讲解如何使用jQuery实现一个功能，即当用户点击input文本框时，弹出一个下拉菜单供用户选择。这个功能在许多网页应用中都非常常见，比如日期选择器、城市选择器等。 首先，我们需要在HTML页面中创建一个...
本资源“jQuery input文本框点击出现下拉选择框特效源码.zip”提供了一种实现输入框点击后展示下拉选择框的特效代码，这在网页表单设计中非常常见，例如搜索框或者选项选择。 jQuery的选择器是其强大功能之一，能够...
在本主题中，我们关注的是一个特定的jQuery特效：在文本框（input）中显示描述文字，当用户开始输入时这些文字会消失。这个功能常见于许多表单设计中，用于提示用户输入内容的类型或者格式，提供更好的用户体验。 ...
例如，一个搜索框可能会显示“请输入标题搜索”，当用户点击文本框或者按下键盘时，这些提示文字会自动消失，让出空间供用户输入自己的搜索关键词。 在Web开发中，实现这样的功能通常涉及到HTML、CSS以及JavaScript...
本示例探讨的是如何利用JavaScript实现一个特定的功能：当用户点击文本框（input type="text"）并使其获得焦点时，改变文本框内部文字的颜色。这个功能常见于各种网页表单中，用于提升用户交互的视觉反馈。 首先，...
根据给定文件的信息，本文将详细探讨如何实现“点击输入框默认文字消失”的效果，并结合提供的代码示例，深入分析四种不同的实现方式及其工作原理。 ### 知识点一：鼠标移动上去，边框变红（第一种方法） 在网页...
当用户点击这段文字时，我们将替换这个元素为一个`<input type="text">`文本框，用户可以在此输入或修改文本。当用户完成编辑并失去焦点（blur）时，我们将文本框的内容更新回原始的`<p>`元素。以下是相关的jQuery...
综上所述，通过结合 zTree 的初始化、事件绑定、自定义样式和搜索功能，我们可以实现点击 input 框时出现下拉菜单的功能。提供的压缩包文件 "zTree_v3" 包含了 zTree 的最新版本，你可以直接使用或参考其中的示例...
### JavaScript 实现文本框提示知识点解析 #### 一、背景介绍 在网页开发过程中，为了提升用户体验，常常需要对用户输入进行即时反馈。其中一种常见的做法就是在用户将光标聚焦到某个输入框时，通过弹出提示的方式...