Saltar al contenido

¿Cómo eliminar el atributo “deshabilitado” usando jQuery?

Solución:

Siempre utilizar el prop() método para habilitar o deshabilitar elementos cuando se usa jQuery (vea a continuación por qué).

En tu caso sería:

$("#edit").click(function(event){
   event.preventDefault();
   $('.inputDisabled').prop("disabled", false); // Element(s) are now enabled.
});

Ejemplo de jsFiddle aquí.


Por que usar prop() cuando podrías usar attr()/removeAttr() ¿para hacer esto?

Básicamente, prop() debe usarse al obtener o configurar propiedades (tal como autoplay, checked, disabled y required Entre otros).

Mediante el uso removeAttr(), estás eliminando por completo el disabled atribuirse a sí mismo – mientras prop() es simplemente establecer el valor booleano subyacente de la propiedad en falso.

Mientras que lo que quieres hacer pueden terminar usando attr()/removeAttr(), no significa eso deberían hecho (y puede causar un comportamiento extraño / problemático, como en este caso).

Los siguientes extractos (tomados de la documentación de jQuery para prop ()) explican estos puntos con mayor detalle:

“La diferencia entre atributos y propiedades puede ser importante en situaciones específicas. Antes de jQuery 1.6, el .attr() El método a veces tenía en cuenta los valores de propiedad al recuperar algunos atributos, lo que podría causar un comportamiento incoherente. A partir de jQuery 1.6, el .prop()
El método proporciona una forma de recuperar explícitamente los valores de propiedad, mientras que
.attr() recupera atributos “.

“Las propiedades generalmente afectan el estado dinámico de un elemento DOM sin cambiar el atributo HTML serializado. Los ejemplos incluyen value
propiedad de los elementos de entrada, la disabled propiedad de entradas y botones, o la checked propiedad de una casilla de verificación. los .prop() El método debe usarse para establecer disabled y checked en vez de .attr()
método. los .val() El método debe usarse para obtener y configurar
value. “

para eliminar el uso de atributos deshabilitados,

 $("#elementID").removeAttr('disabled');

y para agregar el uso de atributos deshabilitados,

$("#elementID").prop("disabled", true);

Disfrutar 🙂

<input type="text" disabled="disabled" class="inputDisabled" value="">
​<button id="edit">Edit</button>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

$("#edit").click(function(event){
    event.preventDefault();
    $('.inputDisabled').removeAttr("disabled")
});​

http://jsfiddle.net/ZwHfY/

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *