javascript - que - copiar texto protegido firefox

Permitir copiar/pegar en un cuadro de texto de entrada deshabilitado en los navegadores Firefox

Question

Tengo un cuadro de texto de entrada deshabilitado:

   <input type="text" name="name" disabled="disabled" />

En IE y en Chrome puedes copiar y pegar el valor poblado en ese campo de entrada pero en Firefox no puedes.

Firefox no permite la manipulación del portapapeles a través de JavaScript para problemas de seguridad válidos.

¿Cualquier sugerencia? Hay un trabajo alrededor de esto?

Answer 1

Consulte mi publicación para la misma pregunta. Hace lo siguiente:

1. Hace que el cuadro de texto sea simplemente de lectura sin utilizar el atributo de solo lectura en la etiqueta de entrada, pero respetará el índice de pestaña y establecerá el foco
2. Admite todas las funciones del portapapeles win y mac con mouse o teclado
3. Permite deshacer, rehacer y seleccionar todo

Restringir entrada de HTML para permitir solo pegar

Answer 2

Este es el comportamiento esperado para un campo deshabilitado. IE y Chrome son generosos, pero Firefox se está comportando de manera adecuada.

Si desea evitar que el usuario cambie el valor del campo, pero aún desea que puedan leerlo y / o copiar su valor, entonces debe usar el atributo de readonly . Esto les permitirá establecer el foco en el elemento (necesario para copiar), y también acceder al campo a través del botón de tab .

Si le preocupa que un usuario presione accidentalmente el botón de retroceso dentro del campo de solo lectura y haga que el navegador navegue hacia atrás en una página, puede usar el siguiente código para evitar ese comportamiento:

document.addEventListener("DOMContentLoaded", function() {
  var inputs = document.querySelectorAll(''[readonly]'');
  for(var i=0; i < inputs.length; i++){
    inputs[i].addEventListener(''keydown'', function(e){
      var key = e.which || e.keyCode || 0;
      if(key === 8){
        e.preventDefault();
      }
    })
  }
});

<input value="Hello World" readonly=readonly />

Answer 3

No me gusta usar readonly = "readonly", alguna vez . Deja el campo enfocable y accesible mediante la tecla tab y, si Dios no lo permite, el usuario pulsa la tecla de retroceso mientras el campo de solo lectura está enfocado, entonces la mayoría de los navegadores lo tratan como si el usuario pulsara el botón "Atrás" y mostrara el página vista anteriormente. No es lo que quiere que suceda cuando completa un formulario grande, especialmente si está usando un navegador arcaico que no conserva los datos del formulario cuando presiona el botón "Siguiente" para volver a él. También es muy, muy malo cuando se utiliza una aplicación web de una sola página, donde ''atrás'' te lleva a otro mundo, y ''siguiente'' ni siquiera restaura tu forma, mucho menos sus datos.

He solucionado esto al presentar DIVs en lugar de campos de entrada cuando necesito que el campo esté deshabilitado (o PRE en lugar de un área de texto). No siempre es fácil de hacer dinámicamente, pero he logrado hacer bastante poco trabajo con las plantillas de AngularJS.

Si tienes tiempo, dirígete al Mozilla Bugzilla y pídele que lo arregle .

Answer 4

Puede lograr esto en el punto compartido mediante el uso del atributo contenteditable de la siguiente manera con jquery.

$ ("# fieldID"). attr ("contenteditable", "falso");

Esto permitirá al usuario resaltar el texto y copiarlo pero no les permitirá ingresar nada en el campo.

Answer 5

readonly="readonly" hará el trabajo

debe ser supported con los principales navegadores