jquery实现非叠加式的搜索框提示效果

2019-11-20 21:17:50

字体：大中小

来源：转载

供稿：网友

以前一直在用JQUERY叠加两个INPUT框来实现登陆中需要输入的用户名、密码来实现提示与用户的输出，这边采用JQUERY在一个INPUT框中实现这种效果，具体做法为：

下面是INPUT框代码：

复制代码代码如下:

下面是JQUERY代码：

复制代码代码如下:

 
//设置搜索的默认值 
$(".search_text").focus(function(){ 
<span style="white-space:pre"> </span>if($(".search_text").val()=='搜索'){ 
<span style="white-space:pre"> </span>$(".search_text").val(""); 
<span style="white-space:pre"> </span>}else{ 
<span style="white-space:pre"> </span>$(".search_text").val($(".search_text").val()); 
<span style="white-space:pre"> </span>} 
}); 
$(".search_text").blur(function(){ 
<span style="white-space:pre"> </span>if($(".search_text").val()==''){ 
<span style="white-space:pre"> </span>$(".search_text").val("搜索"); 
<span style="white-space:pre"> </span>}else{ 
<span style="white-space:pre"> </span>$(".search_text").val($(".search_text").val()); 
<span style="white-space:pre"> </span>} 
}); 

格式神马的我就不调整了，毕竟不是编程中使用的IDE编辑器，有兴趣的话，可以看下哟！

上一篇：JavaScript+CSS控制打印格式示例介绍

下一篇：使用JQUERY进行后台页面布局控制DIV实现左右式