Deshabilitar cuadro de texto sin cambiar de estilo?

¿Cómo se puede deshabilitar un cuadro de texto HTML sin que el navegador cambie la apariencia visual del cuadro de texto?Deshabilitar cuadro de texto sin cambiar de estilo?

Inhabilitamos con jQuery: $(".datepick").attr('readonly', 'readonly');

funciona bien, pero en Firefox aparece el cuadro de texto con un fondo gris y un borde grueso. Queremos evitar que esto suceda.

La razón por la que hacemos esto es hacer que el cuadro de texto del selector de fecha de JQuery sea de solo lectura (para que el usuario tenga que usar el área emergente del calendario).

Fuente

2010-11-11 Marcus Leon

Cuando uso readonly en Firefox (3.6.12), no me da un fondo gris ni un borde diferente. –

Hmm .. Estamos en 3.6.10 –

No obtengo los diferentes estilos tampoco.No puedo resolver la parte de DatePicker, pero he aquí un poco de CSS para anular el estilo "disabled": entrada [deshabilitada] { color de fondo: #FFF; color de borde: # 404040; ancho de borde: 2px 1px 1px 2px; } (basado en los estilos predeterminados de Firefox) – attack

Se podía hacerlo difuminando la introducción de texto en focus:

$('.datepick').focus(function(){ 
    this.blur(); 
});

Como alternativa, puede simplemente desactivar la entrada de texto en la entrada:

$('.datepick').keydown(function(e){ 
    e.preventDefault(); 
});

Fuente

2010-11-11 20:40:44 lonesomeday

Probé el 'e.preventDefault();' .. funcionó, excepto que noté en Chrome que la clave de eliminación aún funcionaba. No pude ingresar texto, pero pude eliminarlo después de seleccionar una fecha usando el control, no lo que quisiera ... –

@Marcus He editado mi pregunta para sugerir usando 'keydown' en lugar de' keypress'. Prefiero la primera técnica, sin embargo. – lonesomeday

La primera solución (desenfoque) no funciona para mí en Chrome. La segunda solución se ve bien! –

-1

cómo sobre attr('disabled', true). para volver a habilitar, removeAttr('disabled')

http://jsfiddle.net/E9m3K/3/

^labrado con discapacidad, ya que lo preguntas a desactivar

http://jsfiddle.net/E9m3K/4/

^labrado de sólo lectura, por lo que es probable que sólo desea anular/definir explícitamente border y background en el css.

Fuente

2010-11-11 20:21:59

Eso todavía hace que el fondo sea gris. Y detiene el funcionamiento del selector de fechas de JQuery. –

¿Solo pones un estilo en el fondo? Lo mismo con el borde .... –

¿Qué estilos cambian cuando establece readonly/disabled = true? –

El atributo disabled del elemento input evita el enfoque y la entrada sin cambiar la apariencia.

Fuente

2010-11-11 20:30:22 BenV

No funciona para mí. Ver mis comentarios a la respuesta de @meder. –

El atributo disabled también evita que se publique el valor en el campo. – Vic

Si desea anular el estilo de un cuadro de entrada deshabilitado, establezca explícitamente el estilo para un cuadro de texto de entrada así:

input[type=text] { 
    color: #000; 
    background-color: #fff; 
} 
/* alternatively you could add textarea to this as well */

, además, podría configurar una clase css como 'discapacitados' cada vez que se fije la entrada a personas con discapacidad y el uso de un estilo CSS discapacitados, así:

input[type=text].disabled { 
    /* disabled styling goes here */ 
}

y luego tener algo de código como este:

$(some_input).attr('disabled', 'disabled'); 
$(some_input).addClass('disabled');

y para volver a activar el campo que podría intentar algo como:

$(some_input).removeAttr('disabled'); 
$(some_input).removeClass('disabled');

Fuente

2013-04-02 08:09:48 DJTripleThreat

Prueba esto:

$(".ui-state-disabled").removeClass("ui-state-disabled");

Estaba trabajando con algunos elementos arrastrables/que se pueden soltar y quise deshabilitar esa funcionalidad sin cambiar su apariencia.

Fuente

2013-11-29 14:39:51 GameThinks

Deshabilitar cuadro de texto sin cambiar de estilo?

Respuesta

Cuestiones relacionadas