1、功能:文本框里有提示信息,当得到焦点的时候,提示信息消失,当失去焦点的时候,如果没有填写内容,提示信息出现
<style type="text/css">
.gray{color:#CCC;}
</style>
<script type="text/javascript" src="../../jquery-1.6.1.min.js"></script>
<script type="text/javascript">
$(function (){
$(".testBlur").addClass("gray")
$(".testBlur").live("focus",function (){//当得到焦点的时候。。。
var currentValue = this.value;
if(currentValue == this.defaultValue){
$(this).val("");
$(this).removeClass("gray");
}
}).live("blur",function (){//失去焦点的时候,如果文本框为空则显示提示信息
var currentValue = $.trim(this.value);
if(currentValue == "" || currentValue.length == 0){
this.value ="请输入整数";
$(this).addClass("gray");
}
});
});
</script>
<input type="text" class="testBlur" value="请输入整数" />
本文介绍了一种使用jQuery实现的文本框提示信息效果。当文本框获得焦点时,提示信息会消失;若用户未输入内容且文本框失去焦点,则提示信息重新显示。通过这种方式可以提升用户体验,并确保用户正确填写表单。
652

被折叠的 条评论
为什么被折叠?



