在密码框展示提示文字的小技巧，兼容ie和火狐（原创）

在密码框显示提示文字的小技巧，兼容ie和火狐（原创）

<input type="text" value="邮箱/会员账号/手机号" id="username" style="width:150px;height:24px;"/>
<div id="pwd_warpper" style="width:150px;height:24px;">
<input type="text" value="请输入密码" id="_password" onfocus="showpassword();" style="width:150px;height:24px;"/>
</div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="code.js"></script>

javascript代码code.js

function showtext() {
    if($("#password").val()=="") {
	$("#pwd_warpper").html("<input type=\"text\" value=\"请输入密码\" id=\"_password\" onfocus=\"showpassword();\" style=\"width:150px;height:24px;\"/>");
    }
}

function showpassword() {
    $("#pwd_warpper").html("<input type=\"password\" value=\"\" id=\"password\" onblur=\"showtext();\" style=\"width:150px;height:24px;\"/>");
    /**
    这里为什么要用setTimeout，因为ie比较傻，刚创建完对象，你直接设置焦点
    在ie下是不会响应的，你必须留出时间给ie缓冲下，所以加上了这个定时器
    **/
    setTimeout(function(){
	$("#password").focus();
    },20);
}

$(function(){
	var usernameDefStr = $("#username").val();
	$("#username").focus(function(){
	    if($(this).val()==usernameDefStr)
	        $(this).val("");
	});
	$("#username").blur(function(){
	    if($(this).val()=="")
	        $(this).val(usernameDefStr);
	});
	
});