html - descargar - Estilos de Phonegap-webkit-user-select: none; deshabilitando el campo de texto

phonegap app

Question

Soy bastante nuevo en Phonegap. Tengo un problema donde el css predeterminado utilizado en un proyecto de Phonegap limpio no permitirá la entrada a los campos de texto. Lo reduje a una línea de 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'' */

    }

La línea del problema es:

-webkit-user-select: none; 

Esto se puede encontrar en www / index.css.

Parece que deshabilitar completamente el campo de entrada no es el efecto deseado.

También he publicado este problema 2 veces antes, pero estaba cerrado, no estoy seguro de por qué ... Mi problema se cerró debido a que no era un problema común. Bueno, todo lo que puedo decir al respecto es que supongo que algunos usuarios de stackoverflow no creen que CSS 3, Phonegap, HTML 5 y -webkit-user-select: es una situación común. Me gustaría diferir.

Sin embargo, puedo ver que este problema también se publicó aquí, y también causa problemas en Safari: Seleccionar usuario: ninguno hace que el campo de entrada sea inaccesible en Safari Aunque es ligeramente diferente.

Mi solución actual es esta:

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

Todavía tengo curiosidad sobre cuál es la solución más elegante para habilitar el ingreso de texto, pero aún mantengo parte de esta copia y la funcionalidad anterior que Phonegap está tratando de lograr. ¡Gracias!

Answer 1

Intenta agregar esto a tu css:

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

Esto anulará la selección de texto que deshabilita que ha establecido en cada elemento (a través del selector *) para los campos de entrada.

Answer 2

Solo agrega reglas a CSS de esta manera:

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

Answer 3

user-select puede causar problemas en los elementos con contenteditable = "true", así que es mejor agregar eso también

  [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;  
  }