基于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)