设为首页 - 加入收藏 - 网站地图 SecYe安全 Www.SecYe.Com - 国内网络信息安全IT技术门户网
当前位置:SecYe > 网页设计 > Jquery > 正文

Jquery文本框输入文字后文本框提示语消失特效

时间:2014-01-08 09:33 来源:未知 作者:www.secye.com 阅读:

简洁实用的jQuery text文本框点击获取焦点时文字提示或焦点文字消失,别看功能小,但用途大。

[JavaScript]代码  

$(document).ready(function(){
	
	//第一种
	$("#focus .input_txt").each(function(){
		var thisVal=$(this).val();
		//判断文本框的值是否为空,有值的情况就隐藏提示语,没有值就显示
		if(thisVal!=""){
			$(this).siblings("span").hide();
		}else{
			$(this).siblings("span").show();
		}
		//聚焦型输入框验证 
		$(this).focus(function(){
			$(this).siblings("span").hide();
		}).blur(function(){
			var val=$(this).val();
			if(val!=""){
				$(this).siblings("span").hide();
			}else{
				$(this).siblings("span").show();
			} 
		});
	});
	
	//第二种
	$("#keydown .input_txt").each(function(){
		var thisVal=$(this).val();
		//判断文本框的值是否为空,有值的情况就隐藏提示语,没有值就显示
		if(thisVal!=""){
			$(this).siblings("span").hide();
		}else{
			$(this).siblings("span").show();
		}
		$(this).keyup(function(){
			var val=$(this).val();
			$(this).siblings("span").hide();
		}).blur(function(){
			var val=$(this).val();
			if(val!=""){
				$(this).siblings("span").hide();
			}else{
				$(this).siblings("span").show();
			}
		})
	});
	 
})

本文来源:SecYe安全网[http://www.secye.com] (责任编辑:SecYe安全)

点击复制链接 与好友分享!

顶一下
(0)
0%
踩一下
(0)
0%
推荐内容