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


    原文: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(); }
     
     
  • 相关阅读:
    数据库_连接查询
    日志
    日常小技巧
    『转载』OpenLayers 5 使用turf.js渲染克里金插值计算的等值面
    Openlayers3中如何优雅的表示等值面
    远程桌面拷贝超大文件
    turf.js intersect()裁剪存在空洞
    web worker示例demo
    meta标签作用
    geojson 标准格式学习
  • 原文地址:https://www.cnblogs.com/tzz-ing/p/5028550.html
Copyright © 2020-2023  润新知