前端 input怎么显示null_前端ios和安卓的兼容性问题

1. 日期兼容性

• 安卓系统下
  Date.parse(new Date(‘2018-03-30 12:00:00’))
  会直接转换成时间戳的形式（简单说就是整数形式）
• ios系统下
  Date.parse(new Date(‘2018-03-30 12:00:00’))
  sorry，转换不了

解决办法：

Date.parse(new Date(‘2018/03/30 12:00:00’))

2. input框聚焦，ios出现outline或者阴影，安卓显示正常

解决办法：

input:focus{outline:none}  //去除外边框
input:{-webkit-appearance: none;}

3. ios系统，会将数字当成电话号码，导致变色

解决办法：

<meta name="format-detection" content="telephone=no"> 
<meta http-equiv="x-rim-auto-match" content="none">

4. input 的placeholder属性会使文本位置偏上

解决办法：

line-height: （和input框的高度一样高）//pc端解决方法
line-height：normal //移动端解决方法

5. input type=number之后，pc端出现上下箭头

解决办法：

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none !important;
	 margin: 0;
 }

6. 禁止安卓识别email

解决办法：

<meta content="email=no" name="format-detection" />

7. ios 设置input 按钮样式会被默认样式覆盖

解决办法：

input,textarea {
	 border: 0;
  -webkit-appearance: none; }

以上是一些常遇到的兼容问题，希望对你有所帮助！

————————————————

版权声明：本文为CSDN博主「*青影」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。

原文链接：

前端ios和安卓的兼容性问题_qq_45891136的博客-CSDN博客​blog.csdn.net