Phonegap样式-webkit用户选择:无;禁用文本字段

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.中找到

似乎完全禁用输入字段并不是想要的效果。

我以前也发布过两次这个问题，但它已经关闭了，不知道为什么。。。由于不是常见问题，我的问题已结束。好吧，我所能说的是，我想stackoverflow的一些用户并不认为CSS 3、Phonegap、HTML 5和-webkit用户选择：是一种常见的情况。我不同意。

然而，我可以看到这个问题也发布在这里，这也导致了Safari中的问题：用户选择：none导致输入字段在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可能会在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;  
}