Javascript entfernt das Attribut "disabled" aus der HTML-Eingabe

100

Wie kann ich das Attribut "disabled" mithilfe von Javascript aus einer HTML-Eingabe entfernen?

<input id="edit" disabled>

Bei onClick möchte ich, dass mein Eingabe-Tag nicht aus dem Attribut "disabled" besteht.

javascript input attributes Jam Ville
quelle
Mögliches Duplikat von Wie deaktiviere ich eine Senden-Schaltfläche, wenn das Kontrollkästchen deaktiviert ist? duplizieren, da diese Frage erklärt, wie man umschaltet, also wie man hier fragt und deaktiviert.
Ciro Santilli 6 冠状 病. 事件 6

Antworten:

196

Setzen Sie die disabledEigenschaft des Elements auf false:

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

Wenn Sie jQuery verwenden, lautet das Äquivalent:

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

Für mehrere Eingabefelder können Sie stattdessen nach Klassen darauf zugreifen:

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

Wo documentkönnte zum Beispiel durch ein Formular ersetzt werden, um nur die Elemente in diesem Formular zu finden. Sie können auch getElementsByTagName('input')alle Eingabeelemente abrufen. In Ihrer forIteration müssten Sie dies dann überprüfen inputs[i].type == 'text'.

David Hedlund
quelle
1
Ja, es funktioniert, aber ich hatte viel Input, um das Gleiche zu tun. Gibt es dafür eine Abkürzung? ist das möglich ('id1', 'id2', 'id3')?
Jam Ville
1
ja es funktioniert! Vielen Dank. Übrigens gibt es bei geElementsBy einen Tippfehler. Ich dachte, es würde nicht funktionieren :)
Jam Ville
34

Warum nicht einfach dieses Attribut entfernen?

  1. Vanille JS: elem.removeAttribute('disabled')
  2. jQuery: elem.removeAttr('disabled')
Dragos Rusu
quelle
1
jQuery("#success").removeAttr("disabled");- das funktioniert bei mir, danke!
Aftamat4ik
vanilla js, removeAttribute wird im IE nicht unterstützt.
MarCrazyness
@MarCrazyness removeAttributescheint in IE11 unterstützt zu werden. Es ist als aktiviert markiert unknown, also kann ich nur den IE öffnen und prüfen, ob es funktioniert. Es tut.
Artur
2

So setzen Sie den disabledWert mit der nameEigenschaft der Eingabe auf false :

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

Die beste Antwort ist einfach removeAttribute

element.removeAttribute("disabled");
Harshit Nigam
quelle
In Firefox ist wie jetzt (2020) das Attribut disabled deaktiviert, obwohl es auf false gesetzt ist. Firefox sucht nur nach dem Attribut selbst. Die beste Lösung ist also, es für Firefox hinzuzufügen oder zu entfernen, und dies funktioniert natürlich für alle gängigen Browser.
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>

Der Code der vorherigen Antworten scheint im Inline-Modus nicht zu funktionieren, aber es gibt eine Problemumgehung: Methode 3.

siehe Demo https://jsfiddle.net/eliz82/xqzccdfg/

crisc82
quelle
Diese beiden arbeiten nicht für mich. method 1 <input type="text" onclick="this.disabled=false;" disabled> <hr> method 2 <input type="text" onclick="this.removeAttribute('disabled');" disabled>
Ambal Mani
1
Sie haben dies abgelehnt, nur weil Sie nicht richtig wissen, wie man eine Antwort liest? Methode 1 stammt aus der Antwort von David Hedlund, Methode 2 aus der Antwort von Dragos Rusu. Sobald ein Element deaktiviert ist, funktioniert "onclick" auf dieses bestimmte Element im Inline-Modus nicht mehr (ich habe den externen js-Modus nicht getestet). Die einzige Möglichkeit, "deaktiviert" zu simulieren, ist eine kleine Problemumgehung mit dem Attribut readonly und einigen CSS. ODER machen Sie ein externes "onclick" -Element wie eine Schaltfläche, die die Eingabe mit Methode 1 und 2 ermöglicht (das funktioniert natürlich).
Crisc82