Fork me on GitHub

移动端小问题总结

发表于

1.关于input[date]相关属性的样式默认字修改

​ [相关地址]{http://www.zhangxinxu.com/wordpress/2013/06/%E4%BC%AA%E5%85%83%E7%B4%A0-%E8%A1%A8%E5%8D%95%E6%A0%B7%E5%BC%8F-pseudo-elements-style-form-controls/}

​ [date地址]{http://www.zhangxinxu.com/study/201101/html5-form-feature-input-date.html}

​ [样式修改地址]{http://www.zhangxinxu.com/study/201306/pseudo-elements-to-style-type-date.html}

​

css:

1
2
3
4
5
6
7
8
input[type="date"]:before{
  content: attr(placeholder);
  /*color:#999999;*/
}
input[type='date']::-inner-spin-button{
  visibility: hidden;
}
input[type='date']::-webkit-inner-spin-button { visibility: hidden; }

​ js:

1
2
3
4
5
6
7
8
var o = document.getElementById('time1');
o.setAttribute('placeholder','到站时间');
o.onfocus = function(){
    this.removeAttribute('placeholder');
};
o.onblur = function(){
    if(this.value == '') this.setAttribute('placeholder','到站时间');
};