基于JQuery实现鼠标点击文本框显示隐藏提示文本


Posted in Javascript onFebruary 23, 2012

比如本人网站的搜索框:

不使用的时候:

基于JQuery实现鼠标点击文本框显示隐藏提示文本

鼠标点击后:

基于JQuery实现鼠标点击文本框显示隐藏提示文本

用JQuery实现这个效果非常简单,下面是代码:

$(document).ready(function () { 
var searchBox = $("#ctl00_txtSearch"); 
searchBox.focus(function () { 
if (searchBox.val() == this.title) { // TextBox控件ToolTip属性转换为Html为title属性 
searchBox.val(""); 
} 
}); 
searchBox.blur(function () { 
if (searchBox.val() == "") { 
searchBox.val(this.title); 
} 
}); 
searchBox.blur(); 
});

其中#ctl00_txtSearch是搜索框的ID(ASP.NET可以通过ClientID获取这个ID)
Javascript 相关文章推荐
javascript新手语法小结
Jun 15 Javascript
开发 Internet Explorer 右键功能表(ContextMenu)
Jul 03 Javascript
在js文件中如何获取basePath处理js路径问题
Jul 10 Javascript
EasyUI中datagrid在ie下reload失败解决方案
Mar 09 Javascript
javascript实现数组中的内容随机输出
Aug 11 Javascript
JavaScript事件学习小结(三)js事件对象
Jun 09 Javascript
Javascript Event(事件)的传播与冒泡
Jan 23 Javascript
用director.js实现前端路由使用实例
Jan 27 Javascript
原生JS+Canvas实现五子棋游戏
May 28 Javascript
什么是Vue.js框架 为什么选择它?
Oct 17 Javascript
JS实现读取xml内容并输出到div中的方法示例
Apr 19 Javascript
关于angular引入ng-zorro的问题浅析
Sep 09 Javascript
js前台判断开始时间是否小于结束时间
Feb 23 #Javascript
Javascript绝句欣赏 一些经典的js代码
Feb 22 #Javascript
JavaScript插入动态样式实现代码
Feb 22 #Javascript
javascript插入样式实现代码
Feb 22 #Javascript
Javascript 中的 call 和 apply使用介绍
Feb 22 #Javascript
JS对象与JSON格式数据相互转换
Feb 20 #Javascript
js 代码优化点滴记录
Feb 19 #Javascript
You might like
用文本作数据处理
2006/10/09 PHP
PHP Memcached应用实现代码
2010/02/08 PHP
PHP 文件上传全攻略
2010/04/28 PHP
php使用GD实现颜色渐变实例
2015/06/02 PHP
PHP使用new StdClass()创建空对象的方法分析
2017/06/06 PHP
PHP laravel中的多对多关系实例详解
2017/06/07 PHP
PHP+Mysql+Ajax实现淘宝客服或阿里旺旺聊天功能(前台页面)
2017/06/16 PHP
PHP封装请求类实例分析【基于Yii框架】
2019/10/17 PHP
Gambit vs CL BO3 第二场 2.13
2021/03/10 DOTA
js中的string.format函数代码
2020/08/11 Javascript
jQuery实现切换页面布局使用介绍
2011/10/09 Javascript
jQuery操作checkbox选择(list/table)
2013/04/07 Javascript
Ajax同步与异步传输的示例代码
2013/11/21 Javascript
一个CSS+jQuery实现的放大缩小动画效果
2014/02/19 Javascript
JS动态日期时间的获取方法
2015/09/28 Javascript
jQuery回到顶部的代码
2016/07/09 Javascript
微信小程序 本地存储及登录页面处理实例详解
2017/01/11 Javascript
深入讲解xhr(XMLHttpRequest)/jsonp请求之abort
2017/07/26 Javascript
详解vue的diff算法原理
2018/05/20 Javascript
node.js实现http服务器与浏览器之间的内容缓存操作示例
2020/02/11 Javascript
Javascript摸拟自由落体与上抛运动原理与实现方法详解
2020/04/08 Javascript
美国东北部户外服装和设备零售商:Eastern Mountain Sports
2016/10/05 全球购物
英国屋顶用品和材料超市:Roofing Supplies UK
2019/08/24 全球购物
Smilodox官方运动服装店:从运动服到健身配件
2020/08/27 全球购物
如何用PHP实现邮件发送
2012/12/26 面试题
母亲80寿诞答谢词
2014/01/16 职场文书
安全生产检查通报
2014/01/29 职场文书
股权收购意向书
2014/04/01 职场文书
学习朴航瑛老师爱岗敬业先进事迹思想汇报
2014/09/17 职场文书
2015年学生会个人工作总结
2015/04/09 职场文书
2015年党员发展工作总结
2015/05/13 职场文书
宇宙与人观后感
2015/06/05 职场文书
《岳阳楼记》原文、译文赏析
2019/09/10 职场文书
Python趣味爬虫之用Python实现智慧校园一键评教
2021/05/28 Python
pytorch 两个GPU同时训练的解决方案
2021/06/01 Python
关于mysql中string和number的转换问题
2022/06/14 MySQL