码上敲享录 > HTML+CSS实战 > input type date 移动端显示placeholder

input type date 移动端显示placeholder

上一章章节目录下一章 2020-04-23已有1999人阅读 评论(0)

css

input[type="date"]:before{

   color:#A9A9A9;

   content:attr(placeholder);

}

input[type="date"].full:before {

   color:black;

  content:""!important;

}


js

$("#date").on("input",function(){

   if($(this).val().length>0){
        $(this).addClass("full");
    }
    else{
         $(this).removeClass("full");
     }
});

html

<input id="date" class="weui_input" type="date" placeholder="出生日期" style="height:20px;overflow:hidden;">


这里说明一下,input不设置高度的话在安卓下会placeholder 跟date 同时显示 而且显示两行, 限制高度加overflow即可解决.



0

有建议,请留言!

  • *您的姓名:

  • *所在城市:

  • *您的联系电话:

    *您的QQ:

  • 咨询问题:

  • 提 交