H5自帶的type=date或者month等日期控件移動端placeholder會無法顯示

解決方法：

html部分

<li class="info-item select-item">
    <input type="month" class="info-input time" placeholder="*入學時間" id="time-sel">
    <span class="icon icon-menu-down"></span>
</li>

css部分

input[type="date"]:before
 
{
    color:#b2b2b2;
    content:attr(placeholder);
}


input[type="date"].full:before {
    color:black;
    content:""!important;
}

scss寫法

/* 解決input為month類型時的placeholder問題 */
input[type="month"]{
    &:before{
        color:#b2b2b2;
        content:attr(placeholder);        
    }

    &.full
 
{
        &:before{
            color:black;
            content:""!important;            
        }
    }
}

js部分

        //選擇入學時間解決input為month類型時placeholder的問題
        $("#time-sel").on("input",function(){
           if($(this).val().length>0){
                $(this).addClass("full");
            }
 
else{
                $(this).removeClass("full");
            }
        }); 

H5自帶的type=date或者month等日期控件移動端顯示placeholder