javascript elimina el atributo "deshabilitado" de la entrada html

101

¿Cómo puedo eliminar el atributo "deshabilitado" de una entrada HTML usando javascript?

<input id="edit" disabled>

en onClick quiero que mi etiqueta de entrada no consista en el atributo "deshabilitado".

javascript input attributes Jam Ville
fuente
posible duplicado de ¿Cómo desactivo un botón de envío cuando la casilla de verificación no está marcada? duplicar porque esa pregunta explica cómo alternar, por lo tanto, cómo habilitar y deshabilitar como se solicita aquí.
Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功

Respuestas:

199

Establezca la disabledpropiedad del elemento en falso:

document.getElementById('my-input-id').disabled = false;

Si está usando jQuery, el equivalente sería:

$('#my-input-id').prop('disabled', false);

Para varios campos de entrada, puede acceder a ellos por clase en su lugar:

var inputs = document.getElementsByClassName('my-input-class');
for(var i = 0; i < inputs.length; i++) {
    inputs[i].disabled = false;
}

Donde documentpodría reemplazarse con un formulario, por ejemplo, para encontrar solo los elementos dentro de ese formulario. También puede utilizar getElementsByTagName('input')para obtener todos los elementos de entrada. En su foriteración, tendrá que verificar eso inputs[i].type == 'text'.

David Hedlund
fuente
1
sí, funciona, pero tuve mucha necesidad de entrada para hacer lo mismo. ¿Hay algún atajo para esto? ¿Es esto posible ('id1', 'id2', 'id3')?
Jam Ville
1
¡Si, funciona! Gracias. por cierto, hay un error tipográfico en geElementsBy. Pensé que no funcionaría :)
Jam Ville
34

¿Por qué no eliminar ese atributo?

  1. vainilla JS: elem.removeAttribute('disabled')
  2. jQuery: elem.removeAttr('disabled')
Dragos Rusu
fuente
1
jQuery("#success").removeAttr("disabled");- esto funciona para mí, ¡gracias!
aftamat4ik
vanilla js, removeAttribute no es compatible con IE.
MarCrazyness
@MarCrazyness removeAttributeparece ser compatible con IE11. Está marcado como unknownen puedo usar, así que abrí IE y verifiqué si funciona. Lo hace.
Artur
2

Para establecer el disableden falso usando la namepropiedad de la entrada:

document.myForm.myInputName.disabled = false;
Henry Hedden
fuente
1

La mejor respuesta es simplemente removeAttribute

element.removeAttribute("disabled");
Harshit Nigam
fuente
en firefox, como nowadys (2020), el atributo deshabilitado está activo aunque se establece en falso. Firefox solo busca el atributo en sí. por lo que la mejor solución es agregarlo o eliminarlo para Firefox, y esto, por supuesto, funciona para todos los navegadores principales.
Raffael Meier
0 
method 1 <input type="text" onclick="this.disabled=false;" disabled>
<hr>
method 2 <input type="text" onclick="this.removeAttribute('disabled');" disabled>
<hr>
method 3 <input type="text" onclick="this.removeAttribute('readonly');" readonly>

El código de las respuestas anteriores no parece funcionar en modo en línea, pero hay una solución alternativa: método 3.

ver demostración https://jsfiddle.net/eliz82/xqzccdfg/

crisc82
fuente
Estos dos no me funcionan. method 1 <input type="text" onclick="this.disabled=false;" disabled> <hr> method 2 <input type="text" onclick="this.removeAttribute('disabled');" disabled>
Ambal Mani
1
¿Ha votado en contra de esto solo porque no sabe cómo leer correctamente una respuesta? El método 1 es de la respuesta de David Hedlund, el método 2 es de la respuesta de Dragos Rusu. Una vez que un elemento está deshabilitado, "onclick" en ese elemento específico ya no funcionará en el modo en línea (no probé el modo js externo). La única forma es simular "deshabilitado" es una pequeña solución usando el atributo readonly y algo de css. O haga un elemento externo "onclick" como un botón que permitirá la entrada usando el método 1 y 2 (que funcionará, por supuesto).
crisc82