Eingabe mit jQuery deaktivieren / aktivieren?

$input.disabled = true;

oder

$input.disabled = "disabled";

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

jQuery 1.6+

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

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

jQuery 1.5 und niedriger

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

Legen Sie das deaktivierte Attribut fest.

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

Zum erneuten Aktivieren ist die richtige Methode zu verwenden .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 beiden anderen Optionen, wenn Sie nur mit einem Element arbeiten:

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

Der Vorteil der Verwendung der Methoden .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 ähnlich anhört removeAttr(), die jedoch NICHT für native Eigenschaften wie 'disabled' Auszug aus der Dokumentation verwendet werden sollte:

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 mehr zum Element hinzugefügt werden. Verwenden Sie .prop (), um diese Eigenschaften stattdessen auf false zu setzen.

Tatsächlich bezweifle ich, dass es viele legitime Verwendungszwecke für diese Methode gibt. Boolesche Requisiten werden so ausgeführt, dass Sie sie auf false setzen sollten, anstatt sie wie ihre "Attribut" -Partner in 1.5 zu "entfernen"

Nur um neue Konventionen zu erreichen und es in Zukunft anpassungsfähig zu machen (es sei denn, die Dinge ändern sich mit ECMA6 drastisch (????):

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

und

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

    // Disable #x
    $( "#x" ).prop( "disabled", true );
    // Enable #x
    $( "#x" ).prop( "disabled", false );

Manchmal müssen Sie das Formularelement wie Eingabe oder Textbereich deaktivieren / aktivieren. Jquery hilft Ihnen dabei, dies einfach zu erreichen, indem Sie das Attribut disabled auf "disabled" setzen. Zum Beispiel:

  //To disable 
  $('.someElement').attr('disabled', 'disabled');

Um ein deaktiviertes Element zu aktivieren, müssen Sie das Attribut "disabled" aus diesem Element entfernen oder die Zeichenfolge leeren. Zum Beispiel:

//To enable 
$('.someElement').removeAttr('disabled');

// OR you can set attr to "" 
$('.someElement').attr('disabled', '');

Siehe: http://garmoncheg.blogspot.fr/2011/07/how-to-disableenable-element-with.html

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

oder

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

Sie können dies irgendwo global in Ihren Code einfügen:

$.prototype.enable = function () {
    $.each(this, function (index, el) {
        $(el).removeAttr('disabled');
    });
}

$.prototype.disable = function () {
    $.each(this, function (index, el) {
        $(el).attr('disabled', 'disabled');
    });
}

Und dann können Sie Dinge schreiben wie:

$(".myInputs").enable();
$("#otherInput").disable();

Wenn Sie nur den aktuellen Status invertieren möchten (wie bei einem Umschalttastenverhalten):

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

Es gibt viele Möglichkeiten, mit denen Sie jedes Element aktivieren / deaktivieren können :

Ansatz 1

$("#txtName").attr("disabled", true);

Ansatz 2

$("#txtName").attr("disabled", "disabled");

Wenn Sie jQuery 1.7 oder eine höhere Version verwenden, verwenden Sie prop () anstelle von attr ().

$("#txtName").prop("disabled", "disabled");

Wenn Sie ein Element aktivieren möchten, müssen Sie nur das Gegenteil von dem tun, was Sie getan haben, um es zu deaktivieren. JQuery bietet jedoch eine andere Möglichkeit, Attribute zu entfernen.

Ansatz 1

$("#txtName").attr("disabled", false);

Ansatz 2

$("#txtName").attr("disabled", "");

Ansatz 3

$("#txtName").removeAttr("disabled");

Wenn Sie jQuery 1.7 oder eine höhere Version verwenden, verwenden Sie prop () anstelle von attr (). Das ist. Auf diese Weise aktivieren oder deaktivieren Sie jedes Element mit jQuery.

Update für 2018:

Jetzt gibt es keine Notwendigkeit für jQuery und es ist eine Weile her , seit gewesen document.querySelector oder document.querySelectorAll(für mehrere Elemente) tut fast genau gleiche Arbeit wie $, plus mehr explizit diejenigen getElementById, getElementsByClassName,getElementsByTagName

Deaktivieren eines Felds der Klasse "Eingabe-Kontrollkästchen"

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

oder mehrere Elemente

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

Mit der Methode jQuery prop () können Sie Formularelemente deaktivieren oder aktivieren oder mithilfe von jQuery dynamisch steuern. Die prop () -Methode erfordert jQuery 1.6 und höher.

Beispiel:

<script type="text/javascript">
        $(document).ready(function(){
            $('form input[type="submit"]').prop("disabled", true);
            $(".agree").click(function(){
                if($(this).prop("checked") == true){
                    $('form input[type="submit"]').prop("disabled", false);
                }
                else if($(this).prop("checked") == false){
                    $('form input[type="submit"]').prop("disabled", true);
                }
            });
        });
    </script>

Deaktivieren:

$('input').attr('readonly', true); // Disable it.
$('input').addClass('text-muted'); // Gray it out with bootstrap.

Aktivieren:

$('input').attr('readonly', false); // Enable it.
$('input').removeClass('text-muted'); // Back to normal color with bootstrap.

Deaktivieren Sie true für den Eingabetyp:

Bei einem bestimmten Eingabetyp ( Bsp. Texteingabe )

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

Für alle Arten von Eingabetypen

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

das funktioniert bei mir

$("#values:input").attr("disabled",true);
$("#values:input").attr("disabled",false);

Ich habe @gnarf answer verwendet und als Funktion hinzugefügt

   $.fn.disabled = function (isDisabled) {
     if (isDisabled) {
       this.attr('disabled', 'disabled');
     } else {
       this.removeAttr('disabled');
     }
   };

Dann verwenden Sie so

$('#myElement').disable(true);

2018 ohne JQuery (ES6)

Alle deaktivieren input:

[...document.querySelectorAll('input')].map(e => e.disabled = true);

Deaktivieren inputmitid="my-input"

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

Die Frage ist bei JQuery, es ist nur zu Ihrer Information.

Ansatz 4 (dies ist eine Erweiterung der Wildcodierer-Antwort )

txtName.disabled=1     // 0 for enable

<input id="txtName">

Verwenden Sie so,

 $( "#id" ).prop( "disabled", true );

 $( "#id" ).prop( "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>

In jQuery Mobile:

Zum Deaktivieren

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

Zum Aktivieren

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