javascript - form - jquery this checked




Deaktivieren/Aktivieren einer Eingabe mit jQuery? (8)

jQuery 1.6+

Um die disabled Eigenschaft zu ändern, sollten Sie die Funktion .prop() verwenden.

$("input").prop('disabled', true);
$("input").prop('disabled', false);

jQuery 1.5 und niedriger

Die Funktion .prop() existiert nicht, aber .attr() tut ähnlich:

Legen Sie das deaktivierte Attribut fest.

$("input").attr('disabled','disabled');

Um es wieder zu aktivieren, verwenden Sie .removeAttr()

$("input").removeAttr('disabled');

In jeder Version von jQuery

Sie können sich immer auf das eigentliche DOM-Objekt verlassen und sind wahrscheinlich etwas schneller als die anderen beiden Optionen, wenn Sie nur mit einem Element arbeiten:

// assuming an event handler thus 'this'
this.disabled = true;

Der Vorteil der Verwendung der .prop() oder .attr() besteht darin, dass Sie die Eigenschaft für eine Reihe ausgewählter Elemente festlegen können.

Hinweis: In 1.6 gibt es eine .removeProp() -Methode, die sich sehr nach removeAttr() , aber sie sollte NICHT für native Eigenschaften wie 'disabled' Auszug aus der Dokumentation:

Hinweis: Verwenden Sie diese Methode nicht, um native Eigenschaften wie "aktiviert", "deaktiviert" oder "ausgewählt" zu entfernen. Dadurch wird die Eigenschaft vollständig entfernt und kann nach dem Entfernen nicht erneut zum Element hinzugefügt werden. Verwenden Sie .prop (), um diese Eigenschaften stattdessen auf false festzulegen.

Tatsächlich bezweifle ich, dass es viele legitime Verwendungen für diese Methode gibt, boolesche Requisiten werden auf eine Weise ausgeführt, dass Sie sie auf "falsch" setzen sollten, anstatt sie wie ihre "Attribut" -Antsprechungen in 1.5 zu entfernen

$input.disabled = true;

oder

$input.disabled = "disabled";

Welches ist der Standardweg? Und umgekehrt, wie aktivieren Sie eine deaktivierte Eingabe?


Benutzen:

$("input[type=text]").attr('disabled', true);

In jQuery Mobile:

Für deaktivieren

$('#someselectElement').selectmenu().selectmenu('disable').selectmenu('refresh', true);
$('#someTextElement').textinput().textinput('disable');

Für aktivieren

$('#someselectElement').selectmenu().selectmenu('enable').selectmenu('refresh', true);
$('#someTextElement').textinput('enable');

Nur um der neuen Konventionen willen und um es anpassungsfähig zu machen (es sei denn, die Dinge ändern sich drastisch mit ECMA6 (????):

$(document).on('event_name', '#your_id', function() {
    $(this).removeAttr('disabled');
});

und

$(document).off('event_name', '#your_id', function() {
    $(this).attr('disabled','disabled');   
});

Update für 2018:

Jetzt ist es nicht mehr nötig jQuery zu verwenden und es ist schon eine getElementById Weile her, seit document.querySelector oder document.querySelectorAll (für mehrere Elemente) fast genau den gleichen Job wie $ haben, plus explizite getElementById , getElementsByClassName , getElementsByTagName

Ein Feld der Klasse "input-checkbox" deaktivieren

document.querySelector('.input-checkbox').disabled = true;

oder mehrere Elemente

document.querySelectorAll('.input-checkbox').forEach(el => el.disabled = true);

Wenn Sie nur den aktuellen Zustand invertieren möchten (wie bei einem Toggle-Button-Verhalten):

$("input").prop('disabled', ! $("input").prop('disabled') );

$("input")[0].disabled = true;

oder

$("input")[0].disabled = false;

<html>
<body>

Name: <input type="text" id="myText">



<button onclick="disable()">Disable Text field</button>
<button onclick="enable()">Enable Text field</button>

<script>
function disable() {
    document.getElementById("myText").disabled = true;
}
function enable() {
    document.getElementById("myText").disabled = false;
}
</script>

</body>
</html>






html-input