jquery 处理密码输入框(input type="password" ) 模仿placeholder

html

<form method="post" action="">
	                <ul>
	                	<li>
	                		<span>邮箱</span>
	                	    <input type="text" name="email" value="请输入邮箱" onfocus="if(value == '请输入邮箱'){value =''}" onblur="if(value == ''){value ='请输入邮箱'}" >
	                	</li>
	                	<li>
	                		<span>密码</span>
	                		<input name="" type="text" value="密码" id="text" >
							<input name="" type="password" style="display:none;" id="password">
	                	</li>
	                	<li>
	                		<span>验证码</span>
	                		<input type="text" name="code" class="code">
	                		<img src="">
	                	</li>
	                	<li>
	                	    <span></span>
	                		<label><input type="checkbox" checked="checked" name="check" class="checked"><i>记住密码</i></label>
	                		<a href="" class="forget">忘记密码</a>
	                	</li>
	                	<li>
	                		<span></span>
	                		<a href="" class="login-btn">登录</a>
	                	</li>
	                </ul>
	            </form>

jquery

<script type="text/javascript">
    function _password(hid,pid){
    	var _hid = $("#"+hid);
    	var _pid = $("#"+pid);
    	_hid.focus(function(){
    		var _hval = $.trim($(this).val());
    		if(_hval != "密码") return;
    		$(this).css("display","none");
            _pid.css("display","block").val("").focus();
    	});
    	_pid.blur(function(){
    		var _hval = $.trim($(this).val());
    		if(_hval != "") return;
    		$(this).css("display","none");
    		_hid.css("display","block").val("密码");
    	})    	
    }
    _password('text','password')
</script>

  

 

posted @ 2015-10-22 11:34  BestSamCN  阅读(2172)  评论(0编辑  收藏  举报