-WEBKIT-USER-SELECT:NONE导致输入框无法输入

最新推荐文章于 2021-12-28 15:10:48 发布

weixin_34304013

最新推荐文章于 2021-12-28 15:10:48 发布

阅读量238

点赞数

文章标签：移动开发 python

原文链接：https://my.oschina.net/u/574928/blog/347364

版权

2019独角兽企业重金招聘Python工程师标准>>>

原文：http://hicc.me/post/webkit-user-select-none-disabling-text-field.html

最近在webview中写页面的时候发现个别Android机型（Google Nexus，Android 4.2.2）输入框无法输入（但是键盘可以弹起，所以不是网上所说webView.requestFocus(View.FOCUS_DOWN);的问题），经过试错发现是-webkit-user-select:none;所导致的原因。

后来网上再搜，果然有同样的问题，Phonegap styles -webkit-user-select: none; disabling text field

当然如果你确实需要这个-webkit-user-select这个属性，也可以这样写css代码（来源于上述的stackoverflow上的回答。）：

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

在此还想做的引申是，如果是web应用使用了iscroll这个插件，在某些机型上在iscroll4的滚动容器范围内，点击input框、select等表单元素时没有响应，光标不定位，键盘不弹出，原因在于iscroll一直监听用户的touch操作，以便灵敏的做出对应效果，所以它把其余的默认事件屏蔽了，解决的方法是，在iscroll4源码里面找到这一行：

onBeforeScrollStart: function (e) { e.preventDefault(); }
//改为
onBeforeScrollStart: function (e) { var nodeType = e.explicitOriginalTarget ? e.explicitOriginalTarget.nodeName.toLowerCase():(e.target ? e.target.nodeName.toLowerCase():”);if(nodeType !=’select’&& nodeType !=’option’&& nodeType !=’input’&& nodeType!=’textarea’) e.preventDefault(); }

上述代码来自：http://www.gafish.net/archives/1141，
还有插件官方的解决方案：https://github.com/cubiq/iscroll/commit/feb0088a996a28ebd0a7a37ee7b9e31a50a4a58e

转载于:https://my.oschina.net/u/574928/blog/347364