问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

密码框提示变成 .

头像
陈小小
    26165471

    密码框里的提示“密码”两个字变成两个点了，怎么解决
    （不要用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>
    javascriptjquery
    阅读 3.2k
    3 个回答
    得票最新
    头像
    JunIce
      84410
      ✓ 已被采纳

      <input type="text" value="请输入密码!" onfocus="if(this.value==defaultValue) {this.value='';this.type='password'}" onblur="if(!value) {value=defaultValue; this.type='text';}" style="color:#CCC;" />

      头像
      Alsolee
        1.2k119

        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>

        图片描述

        头像
        遇见飞行
          3557

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

          撰写回答
          你尚未登录，登录后可以
          • 和开发者交流问题的细节
          • 关注并接收问题和回答的更新提醒
          • 参与内容的编辑和改进，让解决方法与时俱进
          推荐问题