javascript usuwa atrybut „disabled” z danych wejściowych html

103

Jak mogę usunąć atrybut „wyłączony” z danych wejściowych HTML za pomocą javascript?

<input id="edit" disabled>

w onClick Chcę, aby mój znacznik wejściowy nie składał się z atrybutu „wyłączony”.

Jam Ville
źródło
możliwy duplikat Jak wyłączyć przycisk przesyłania, gdy pole wyboru jest odznaczone? duplikat, ponieważ to pytanie wyjaśnia, jak przełączać, a zatem jak włączać i wyłączać zgodnie z pytaniem tutaj.
Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功

Odpowiedzi:

201

Ustaw właściwość elementu na disabledfalse:

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

Jeśli używasz jQuery, odpowiednikiem byłoby:

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

W przypadku kilku pól wejściowych możesz zamiast tego uzyskać do nich dostęp według klasy:

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

Gdzie documentmożna na przykład zastąpić formą, aby znaleźć tylko elementy wewnątrz tej formy. Możesz również użyć getElementsByTagName('input')do pobrania wszystkich elementów wejściowych. W swojej foriteracji musiałbyś to sprawdzić inputs[i].type == 'text'.

David Hedlund
źródło
1
tak, to działa, ale miałem dużo wkładu, aby zrobić to samo. Czy jest do tego jakiś skrót? czy to możliwe („id1”, „id2”, „id3”)?
Jam Ville
1
tak to działa! dzięki. Nawiasem mówiąc, w geElementsBy jest błąd literowy. Myślałem, że to nie zadziała :)
Jam Ville
34

Dlaczego po prostu nie usunąć tego atrybutu?

  1. waniliowy JS: elem.removeAttribute('disabled')
  2. jQuery: elem.removeAttr('disabled')
Dragos Rusu
źródło
1
jQuery("#success").removeAttr("disabled");- to działa dla mnie, dzięki!
aftamat4ik
vanilla js, removeAttribute nie jest obsługiwana w IE.
MarCrazyness,
removeAttributeWydaje się, że @MarCrazyness jest obsługiwany w IE11. Jest oznaczony jako unknownwłączony, mogę używać, więc właśnie otworzyłem IE i sprawdziłem, czy działa. To robi.
Artur
2

Aby ustawić wartość disabledfalse przy użyciu namewłaściwości wejścia:

document.myForm.myInputName.disabled = false;
Henry Hedden
źródło
1

Najlepszą odpowiedzią jest po prostu removeAttribute

element.removeAttribute("disabled");
Harshit Nigam
źródło
w firefox, podobnie jak nowadys (2020), atrybut disabled jest aktywny, chociaż jest ustawiony na false. firefox po prostu szuka samego atrybutu. więc najlepszym rozwiązaniem jest dodanie lub usunięcie go dla przeglądarki Firefox, a to oczywiście działa dla wszystkich głównych przeglądarek.
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>

kod poprzednich odpowiedzi nie wydaje się działać w trybie inline, ale istnieje obejście: metoda 3.

zobacz demo https://jsfiddle.net/eliz82/xqzccdfg/

crisc82
źródło
Ta dwójka nie działa dla mnie. method 1 <input type="text" onclick="this.disabled=false;" disabled> <hr> method 2 <input type="text" onclick="this.removeAttribute('disabled');" disabled>
Ambal Mani
1
Odrzuciłeś to tylko dlatego, że nie umiesz właściwie odczytać odpowiedzi? Metoda 1 pochodzi z odpowiedzi Davida Hedlunda, metoda 2 pochodzi z odpowiedzi Dragos Rusu. Gdy element zostanie wyłączony, "onclick" na tym konkretnym elemencie nie będzie już działać w trybie inline (nie testowałem zewnętrznego trybu js). Jedynym sposobem jest zasymulowanie „wyłączonego” to małe obejście za pomocą atrybutu tylko do odczytu i trochę css. LUB utwórz zewnętrzny element „onclick”, taki jak przycisk, który umożliwi wprowadzanie danych metodą 1 i 2 (to oczywiście zadziała).
crisc82