文本框获得焦点时,内容逐渐消失;失去焦点时,内容又逐渐出现!最好用jquery实现,谢谢各位高手指教!

kuaidi.ping-jia.net  作者:佚名   更新日期:2024-07-24
JQuery文本框 获得焦点 背景颜色改变

1、先使用jQuery选择器找到所有的文本框
2、为文本框注册获得焦点事件,即focus事件
3、在焦点事件的事件处理函数中对当前得到焦点的文本框设置背景色
4、注册失去焦点事件,即blur事件
5、在失去焦点的事件处理函数中对当前触发事件的文本框改变背景颜色
$(function(){ //找到文本框,并注册得到焦点事件 $("input:text").focus(function(){ //让当前得到焦点的文本框改变其背景色 $(this).css("background","pink"); }); //找到文本框,并注册失去焦点事件 $("input:text").blur(function(){ //让当前失去焦点的文本框背景色变为白色 $(this).css("background","white"); }); });

html:


jquery:
$("input").blur(function(){
$(this).next("span").html("提示信息");
})

给你写了一个,你看看。我用的是jquery-1.4.2.min.js,你要自己引用本地的jQuery库

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{
padding:0;
margin:0;}
#searchForm{
position:relative;
margin:50px;
}
#infor{
position:absolute;
left:5px;
top:0px;}
#search{
width:300px;
height:20px;}
</style>
<script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
$('#search').bind('focus',function(){
$('#infor').fadeOut('slow');
});
$('#search').bind('blur',function(){
$('#infor').fadeIn('slow');
});
});
</script>
</head>
<body>
<div id="searchForm">
<label for="search" id="infor" >Start your style search here</label>
<input name="" type="text" id="search"/>
</div>
</body>
</html>

$("#textareavs").focus(function(){

var txt_value=$(this).val();
if(txt_value==this.defaultValue){$(this).val("");}

});

$("#textareavs").blur(function(){

var txt_value=$(this).val();
if(txt_value==""){$(this).val(this.defaultValue);}

});

呢,你看下他的代码结构

<div class="search" id="searchForm">
<label for="ctl00_ContentHeader_ctlTitleBar_ctlSearchBox_txtSearch" >
Start your style search here
</label>
<input />
</div>
也就是说,你看到的Start your style search here不是在input中的,而是在一个lable中,
将lable用样式浮动到input上,慢慢消失的是lable

-validate 规则: 如果没有填写只有在 onsubmit 的时候才提示未填写。。
默认 onfocusout 和 onkeyup true,
如果有其他验证,如minlength 等验证,在填写时,不满足就会在失去焦点的时候就验证错误。
就是没有输入,onfocusout 不会被触发。。(个人理解)

  • 文本框获得焦点时,内容逐渐消失;失去焦点时,内容又逐渐出现!最好用jq...
    答:给你写了一个,你看看。我用的是jquery-1.4.2.min.js,你要自己引用本地的jQuery库 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 无标题文档 { padding:0;margin:0;} searchForm{ position:rel...
  • 常用的电脑操作小技巧
    答:破解办法如下: 在目标上点鼠标右键,出现添加到收藏夹的窗口,这时不要松开右键,也不要移动鼠标,而是使用键盘的TAB键,移动焦点到取消按钮上,按下空格键,这时窗口就消失了,松开右键后,我们熟悉的右键菜单又出现了。 第三种情况,超链接无法用鼠标右键弹出“在新窗口中打开”菜单的。这时用上面的两种办法无法破解,看看我...
  • 记忆为什么会消失?
    答:1.瞬间记忆;当我们不经意间,偶然间听到或看到某些声音和画面时,在大脑中只会有一点印象便消失了,这是瞬间记忆。2,短时记忆;大脑在记忆某些事情时,这些信息能在大脑中保留一段时间,便会遵循记忆遗望规律而随着时间的流逝而慢慢遗忘,最后这些信息在大脑中一直不用的话就会消失。比如我们学习汉字...
  • ...窗口有个逐渐向左下角缩小过程而不是一下子消失,这个怎么设置?_百度...
    答:win+方向键的上下键,可以实现当前获得焦点的窗口逐渐变化,你可以试试,一下就明白了
  • 导致你缺乏动力的事情和解决方法
    答:当你无法获得成功所需的动力时,可能是因为你想要获得动力的事情太模糊了。以下是一些过于模糊的目标的例子: 早点醒来。多运动。健康饮食。 如果你选择以上任何一个例子,以下是最有可能发生的事情: 一开始你会有很多动力…… 但是过了一段时间,你会发现这种动力逐渐消失了,失去了它的效力。 那么,解决办法是什么呢...
  • 我们该怎么制作ppt才最好
    答:1.运用视觉效果焦点位。在一个PPT文稿屏幕上,一般视觉效果焦点会处于正中央或正中偏上方的位置;制作PPT演示文稿时要将内容放在屏幕的焦点位,让观众一眼就可以看到内容所在,进而进行驻目详读。2.注意文字内容要简单。在制作PPT演示文稿时,注意文字内容要简单。只有简单的文字内容,才可 以一眼找到内容...
  • 退休职工思想动态分析
    答:一、离退休职工思想不稳定因素的成因 在从计划经济向市场经济转型的过程中,特别是所有制结构和经济结构的调整,企业改革的进一步深化,生活福利方面大锅饭的状况逐渐消失,后勤服务社会化逐步推进,使一些历史遗留问题形成了焦点,在接受能力较差和心理不平衡的状态下,逐渐形成了一些离退休职工思想不稳定因素。
  • 求一招好用的电脑技术
    答:其实,要想彻底删除“我的音乐”、“图片收藏”等文件夹,我们只要先在Windows“运行”对话框中输入“Regsvr32 /u mydocs.dll”这个命令,然后就可以彻底删除它们。 44、 禁止任务栏保存修改 在日常的教学过程中,经常发现学生有意无意地修改任务栏的属性。造成下次上机时任务栏、时间图标等信息不能正常显示。通过对...
  • 记忆为什么会消失?
    答:因为普通人的记忆力是有限的,有时候你记住了某些东西.一部小心把它忽略了,就会慢慢把它忘记,因为人的记忆都会通过时间的增加而增加。
  • 善意取得制度详细内容
    答:因此,第三人即使是善意,也不应取得所有权。4、盗窃物和遗失物。在各国法例上,盗窃物和遗失物一般都不能适用善意取得。罗马法规定,凡占有盗赃和遗失之物,不因时效消失,权利人无论何种情况都可提起回收之诉。其他如日耳曼习惯法、摩奴法典、汉谟拉比法典、我国法律等都有类似规定。近现代民法也贯彻了这一精神。