Hinzufügen von deaktivierten Attribut zu Eingabeelement mit Javascript

Question

Ich habe ein Eingabefeld und ich möchte es deaktiviert und gleichzeitig ausblenden, um Probleme bei der Portierung meines Formulars zu vermeiden.

Bisher habe ich den folgenden Code meine Eingabe zu verbergen:

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show().find('.longboxsmall').hide(); 
}); 

Dies ist der Eingang, die als Ergebnis versteckt werden:

<input class="longboxsmall" type="text" /> 

Wie kann ich auch das disabled-Attribut hinzufügen die Eingabe?

Answer 1

$("input").attr("disabled", true); ab ... Ich weiß es nicht mehr.

Es ist Dezember 2013 und ich habe wirklich keine Ahnung was ich dir sagen soll.

Zuerst war es immer .attr(), dann war es immer .prop(), also kam ich hierher zurück aktualisiert die Antwort und machte es genauer.

Dann ein Jahr später änderte jQuery wieder ihre Meinung und ich will nicht einmal das verfolgen.

Lange Rede, kurzer Sinn, jetzt ist dies die beste Antwort: "Sie können beide verwenden ... aber es kommt darauf an."

Sie diese Antwort lesen sollte stattdessen: https://stackoverflow.com/a/5876747/257493

Und ihre Release Notes für diese Änderung sind hier enthalten:

Weder .attr() noch .prop() sollte für immer/Einstellung verwendet werden Wert. Verwenden Sie stattdessen die .val() -Methode (obwohl die Verwendung von .attr ("value", "somevalue") weiterhin funktioniert, wie vor 1.6).

Zusammenfassung von bevorzugten Usage

Die .prop() Methode sollte für Boolesche Attribute/Eigenschaften und Objekte verwendet werden, die in HTML (wie window.location) nicht existieren. Alle anderen Attribute (die Sie im HTML sehen können) können und sollten weiterhin mit der Methode .attr() manipuliert werden.

Oder mit anderen Worten:

".prop = Nicht-Dokument stuff"

".attr" = document Sachen

... ...

Können wir alle hier eine Lektion über API-Stabilität lernen ...

direkt

Answer 2

Verwenden Sie einfach attr() Methode jQuery

$(this).closest("tr").next().show().find('.longboxsmall').attr('disabled', 'disabled'); 

Answer 3

Sie können die DOM-Element erhalten, und die Eigenschaft disabled gesetzt.

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show() 
      .find('.longboxsmall').hide()[0].disabled = 'disabled'; 
}); 

oder wenn es mehr als eine ist, können Sie each() verwenden alle von ihnen zu setzen:

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show() 
      .find('.longboxsmall').each(function() { 
       this.style.display = 'none'; 
       this.disabled = 'disabled'; 
      }); 
}); 

Answer 4

$(element).prop('disabled', true); //true|disabled will work on all 
$(element).attr('disabled', true); 
element.disabled = true; 
element.setAttribute('disabled', true); 

Alle oben genannten sind absolut gültige Lösungen. Wählen Sie diejenige, die am besten zu Ihren Bedürfnissen passt.

Answer 5

Wenn Sie jQuery verwenden, gibt es verschiedene Möglichkeiten, das deaktivierte Attribut festzulegen.

var $element = $(...); 
    $element.prop('disabled', true); 
    $element.attr('disabled', true); 

    // The following do not require jQuery 
    $element.get(0).disabled = true; 
    $element.get(0).setAttribute('disabled', true); 
    $element[0].disabled = true; 
    $element[0].setAttribute('disabled', true); 

Answer 6

Arbeits Code aus meinen Quellen:

HTML WORLD

<select name="select_from" disabled>...</select> 

---

JS WORLD

var from = jQuery('select[name=select_from]'); 

//add disabled 
from.attr('disabled', 'disabled'); 



//remove it 
from.removeAttr("disabled");