Question

我对Phonegap很新。我有一个问题，在一个干净的Phonegap项目中使用的默认css将不允许输入文本字段。我把它缩小到一行CSS：

* {
            -webkit-touch-callout: none;                /* prevent callout to copy image, etc when tap to hold */
            -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
            -webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
            -webkit-user-select: none;                 /* prevent copy paste, to allow, change 'none' to 'text' */

    }

问题在于：

-webkit-user-select: none;

这可以在www / index.css中找到。

似乎完全禁用输入字段不是所需的效果。

我之前已经发过2次这个问题，但它已经关闭，不知道为什么......我的问题由于不是常见问题而被关闭了。好吧，我所能说的就是，我想stackoverflow的一些用户不认为CSS 3，Phonegap，HTML 5和-webkit-user-select：是一种常见的情况。我不同意。

但是我可以看到这个问题也发布在这里，也导致Safari出现问题：User select:none causes input field to be inaccessible on Safari虽然略有不同。

我目前的解决方案是：

-webkit-user-select: text; /* change 'none' to 'text' */

仍然很好奇是什么是启用文本输入的最优雅的解决方案，但仍然保留了Phonegap试图实现的一些复制和过去的功能。谢谢！

Answer 1

尝试将此添加到您的css：

input {
    -webkit-user-select: auto !important;
}

这将覆盖您在输入字段的每个元素（通过*选择器）上设置的文本选择禁用。

Answer 2

只需以这种方式向css添加规则：

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

Answer 3

user-select会导致元素出现问题=“true”，所以最好添加

  [contenteditable="true"] , input, textarea {
        -webkit-user-select: auto !important;
        -khtml-user-select: auto !important;
        -moz-user-select: auto !important;
        -ms-user-select: auto !important;
        -o-user-select: auto !important;
        user-select: auto !important;  
  }

Phonegap styles -webkit-user-select：none;禁用文本字段

3 个答案: