[移动开发]解决 input 输入框在 iOS 系统中无法输入内容

问题

input 输入框在 Android 系统可以输入和点击，但是在 iOS 系统上 input 输入框无法点击和输入。

解决

去掉下列样式

-webkit-touch-callout:none;
-webkit-user-select:none;

或者这样写

*:not(input, textarea) {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
}

拓展

关于 user-select 属性

定义和用法
user-select 属性规定是否能选取元素的文本。
在 web 浏览器中，如果您在文本上双击，文本会被选取或高亮显示。此属性用于阻止这种行为。

语法

user-select: auto|none|text|all;

属性值

关于 -webkit-touch-callout 属性

注意：该特性是非标准的，请尽量不要在生产环境中使用它！
概述：-webkit-touch-callout 这个CSS 属性禁用了默认的callout展示， callout 是指当触摸并按住一个元素的时候出现的提示。
当在iOS上一直按住一个目标元素时，Safari会展示一个关于这个链接的callout信息。webkit-touch-callout 属性允许禁用掉这一行为。

语法：

-webkit-touch-callout: default   /* 显示标注 */
-webkit-touch-callout: none      /* 禁用标注 */

-webkit-touch-callout: initial
-webkit-touch-callout: inherit
-webkit-touch-callout: unset

示例：

.example {
  -webkit-touch-callout: none;
}

兼容性：

iOS 2.0及更高版本的Safari浏览器可用
Android尚不明确

创作打卡挑战赛

赢取流量/现金/CSDN周边激励大奖