欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

safari中的input、textarea无法输入的问题

程序员文章站 2024-03-25 11:15:46
...

原因是这两种表单元素上应用了user-select:none的css属性。一般没人刻意这么做,可能是这样的情况:

*{
  /*font-family:"PingFang SC";*/
  font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB",Arial,sans-serif;
  -moz-user-select: none;
  /*会导致在safari中input不能输入*/
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
在css中排除掉这两种元素就好了:
* {
    user-select: none;
}

input, textarea {
    user-select: text;  
}

 

 解决方法:

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-tap-highlight-color: transparent;
outline: none;
}

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

 

相关标签: 大前端爬坑之路