36

我对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 中的问题：用户选择：无导致输入字段在 Safari 上无法访问，尽管略有不同。

我目前的解决方案是这样的：

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

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

4

3 回答 3

41

尝试将此添加到您的CSS：

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

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

于 2012-10-22T20:40:25.960 回答
27

只需通过这种方式将规则添加到 css 中：

*:not(input,textarea) {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}
于 2013-04-03T13:16:57.080 回答
5

user-select可能会导致 contenteditable="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;  
  }
于 2013-08-06T19:31:21.503 回答