密码框提示变成 .

密码框里的提示“密码”两个字变成两个点了，怎么解决
（不要用placeholder，不兼容ie8）

解决了，不过不知道会不会有bug

         <!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" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<title>无标题文档</title>
<script type="text/javascript">
$(function(){
    $("#mima").focusin(function () { 
    if($("#mima").val()==""||$("#mima").val()=="密码")
    {
        
     $(this).val("");
     $(this).attr('type','password');
   }
 });
   
   $("#mima").focusout(function () { 
    if($("#mima").val()==""||$("#mima").val()=="密码")
    {
     $(this).val("密码");
     $(this).attr('type','text');
   }
 });
    });


</script>
</head>

<body>

 <input name="mima" id="mima"  style="line-height:270%" type="text" value="密码"    />
</body>
</html>

type="password"的input里面的值都是显示*号的啊，如果要加提示请使用placeholder属性

<input name="mima" id="mima" type="password" placeholder="密码" />

---------分割线-------

要兼容ie8那就使用伪类来实现，当input值为空时，给父容器class加上empty

div.empty:before {
    position: absolute;
    content: '密码';
    color: gray;
}

<div class="empty">
    <input type="password">
</div>

我昨天也遇到相同问题，没想到解决办法，你这思路可以，很棒

【热门文章】