通常用户在搜索内容时，在文本框输入内容前，文本框都会给出默认提示，提示用户输入正确的内容进行搜索。
当文本框获得焦点，如果文本框内容跟提示内容一样，提示内容会自然消失。
当文本框没有任何值并失去焦点，文本框内容会重新生成默认提示。
为了实现上面的需求，代码如下：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Recipe1.aspx.cs" Inherits="Recipe1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Recipe1</title>
<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<style type="text/css">
.defaultText
{
font-style: italic;
color: #CCCCCC;
}
</style>
<script type="text/javascript">
$(document).ready(function () {
var searchBox = $("#<%=txtSearch.ClientID %>"); // 通过ClientID获取服务器控件ID
searchBox.focus(function () {
if (searchBox.val() == this.title) { // TextBox控件ToolTip属性转换为Html为title属性
searchBox.val("");
searchBox.removeClass("defaultText");
}
});
searchBox.blur(function () {
if (searchBox.val() == "") {
searchBox.val(this.title);
searchBox.addClass("defaultText");
}
});
searchBox.blur();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<p>
</p>
<div align="center">
<fieldset style="width: 400px; height: 80px;">
<p>
<asp:TextBox ID="txtSearch" runat="server" Width="200px" CssClass="defaultText" ToolTip="请输入搜索的关键字"></asp:TextBox>
<asp:Button ID="btnSearch" runat="server" Text="搜索" /></p>
</fieldset>
</div>
</form>
</body>
</html>
显示效果：
转载：http://www.cnblogs.com/iamlixin/archive/2012/01/08/2316395.html
相关推荐
jQuery实现文本框获得焦点文字消失 1、文本框获得焦点改变文字颜色的jQuery代码； 2、文本框获得焦点仅文字消失，不牵扯到样式改变；
js代码 [removed] //显示限制输入字符method function textAreaChange(obj){ ... var count_total = $this...jQuery textarea文本框输入文字字数限制提示代码，设置固定输入字符，实时计算显示已经输入多少字符。
当input失去焦点时 会判断输入值与默认值是否一致 如果一致（或空）则再次显示默认提示信息 若不一致（已输入信息）则input值为所输入值 3 此插件是jquery插件 调用方式为 $ "#xxx" autoTip ; 并可以指定...
文本框默认显示提示信息，jQuery插件
Jquery实现仿搜索引擎文本框自动补全插件功能很实用，使用也很简单，引入了插件之后写几行代码就可以实现，可以灵活设置 //width:下拉框的宽度，默认使用输入框宽度、用来ajax后台获取数据，返回的数据格式为data...
本文实例讲述了jQuery简单实现input文本框内灰色提示文本效果的方法。分享给大家供大家参考，具体如下： $(function(){ $(.grayTips).each(function(){ //遍历每个文本框 var objTextBox=$(this); var oldText=$...
通常用户在搜索内容时，在文本框输入内容前，文本框都会给出默认提示，提示用户输入正确的内容进行搜索。 当文本框获得焦点，如果文本框内容跟提示内容一样，提示内容会自然消失。 当文本框没有任何值并失去焦点，...
jQ向上滑动提示表单是一款基于jquery实现的提示信息向上滑动显示的表单效果，表单内的文本框默认显示提示信息，文本框获得焦点时，提示信息向上滑动显示，方便用户数据，效果非常不错。
我们做搜索框的时候，经常需要这样一个效果：搜索框默认显示一段提示文本，比如“输入关键词”，鼠标点击后，清空这段文本。鼠标再次点击别的地方，又要恢复这段文本
当文本框没有任何值并失去焦点，文本框内容会重新生成默认提示。 为了实现上面的需求，代码如下： 代码如下: <%@ Page Language=”C#” AutoEventWireup=”true” CodeFile=”Recipe1.aspx.cs” Inherits=”...
超实用的jQuery代码段精选近350个jQuery代码段，涵盖页面开发中绝大多数要点、技巧与方法，堪称史上最实用的jQuery代码参考书，可以视为网页设计与网站建设人员的好帮手。《超实用的jQuery代码段》的代码跨平台、跨...
我们在登录网站的时候，文本框中经常会有提示你输入的信息，当你点击文本框，提示信息自动消失，当文本框什么都没有，而且失去焦点的时候，又有了提示文字。 1.原型开发，先做一个简单的： 我们首先需要一个html文件...
23:遍历集合 24:属性开始过滤 25:属性结尾过滤 26:组合选择 27:子元素过滤1 28:子元素过滤2 29:表单对象 30:下拉选项 31:选择器中的空格 32:表单选择器1 33:表单选择器2 34:选取单行文本框 35:统计差异 36:隔行改变...
2 空关键词查询开关(emptyRequest)，打开则鼠标点在输入框内即出现提示（当下拉列表用），默认为true（图1）3 支持关联查询，即当前文本框的提示结果可依据页面另一个元素的取值 3.1 只支持一个关联元素（即父元素...
因公司需要做一个仿百度搜索框,并且带Value值的, 网上找了下只有Text, ... var defaults = { width: c.width(), //提示框的宽度 默认跟文本框一样 maxheight: 150, //提示框的最大高度 top: 6, //与文本框的上下距离 u
前端校验有很多现成的组件，比较好用的有 EasyUI 的 validatebox 插件，提示界面做的相当友好，只是validatebox 默认提供的校验规则比较有限，有时我们需要添加自己的校验规则。 rules: { emai
2.列表页导航分页加入超过100分页时，下拉选择自动变成文本框输入，防止下拉项太多而影响速度 3.纠正文章管理因异常栏目信息，而造成页面错误 4.生成的缓存文件加入和%>字符的编码，防止因配置内容含asp代码而造成...
-为空则使用默认的提示信息，默认的提示信息支持多语言，建议一般情况下使用默认信息。 +为表单字段增加MarkInvalid和GetMarkInvalidReference函数(feedback:sun1299shine)。 -增加示例：form/form_validate....
-为空则使用默认的提示信息，默认的提示信息支持多语言，建议一般情况下使用默认信息。 +为表单字段增加MarkInvalid和GetMarkInvalidReference函数(feedback:sun1299shine)。 -增加示例：form/form_validate....