jQueryで入力を無効/有効にしますか？

$input.disabled = true;

または

$input.disabled = "disabled";

標準的な方法はどれですか？そして逆に、無効にされた入力をどのように有効にしますか？

jQuery 1.6以降

disabledプロパティを変更するには、.prop()関数を使用する必要があります。

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

jQuery 1.5以下

.prop()関数が存在しませんが.attr()似て行います。

無効化された属性を設定します。

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

再び有効にするには、適切な方法は .removeAttr()

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

jQueryのすべてのバージョン

1つの要素のみを処理する場合は、常に実際のDOMオブジェクトに依存することができ、おそらく他の2つのオプションよりも少し高速です。

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

.prop()または.attr()メソッドを使用する利点は、選択した一連のアイテムのプロパティを設定できることです。

注： 1.6であり.removeProp()のようにたくさんの音の方法removeAttr()、それは使用すべきではないようなネイティブの性質上'disabled' の文書からの抜粋：

注：このメソッドを使用して、チェック済み、無効、または選択済みなどのネイティブプロパティを削除しないでください。これにより、プロパティが完全に削除されます。一度削除すると、要素に再度追加することはできません。代わりに.prop（）を使用して、これらのプロパティをfalseに設定してください。

実際、この方法には多くの正当な用途があるとは思えません。ブールプロップは、1.5の「属性」のように「削除」するのではなく、falseに設定する方法で行われます。

新しい規則のために&&順応性を高めるために（ECMA6で大幅に変更されない限り（????）：

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

そして

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

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

入力やテキストエリアなどのフォーム要素を無効/有効にする必要がある場合があります。JQueryは、disabled属性を "disabled"に設定することで、これを簡単に行うことができます。たとえば：

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

無効な要素を有効にするには、この要素から「無効」属性を削除するか、その文字列を空にする必要があります。たとえば：

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

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

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

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

または

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

あなたはこれをあなたのコードのどこかにグローバルに置くことができます：

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

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

そして、あなたは次のようなものを書くことができます：

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

現在の状態を反転したいだけの場合（トグルボタンの動作など）：

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

それらを使用して任意の要素を有効/無効にすることができる多くの方法があります：

アプローチ1

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

アプローチ2

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

jQuery 1.7以降のバージョンを使用している場合は、attr（）ではなくprop（）を使用してください。

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

要素を有効にしたい場合は、それを無効にするために行ったのと反対のことをしなければなりません。ただし、jQueryは属性を削除する別の方法を提供します。

アプローチ1

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

アプローチ2

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

アプローチ3

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

ここでも、jQuery 1.7以降のバージョンを使用している場合は、attr（）の代わりにprop（）を使用します。それです。これは、jQueryを使用して要素を有効または無効にする方法です。

2018年の更新：

今そこにjQueryのは必要ません、それはしばらく以来となっていますdocument.querySelector かdocument.querySelectorAll（複数の要素のために）$、加えて、より明確なものとほとんど同じ仕事をしますgetElementById、getElementsByClassName、getElementsByTagName

「input-checkbox」クラスの1つのフィールドを無効にする

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

または複数の要素

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

jQuery prop（）メソッドを使用して、jQueryを使用してフォーム要素またはコントロールを動的に無効または有効にすることができます。prop（）メソッドにはjQuery 1.6以上が必要です。

例：

<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>

無効化：

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

有効化：

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

入力タイプのtrueを無効にする：

特定の入力タイプの場合（例：テキストタイプ入力）

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

すべてのタイプの入力タイプ

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

これは私のために働く

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

@gnarf回答を使用し、関数として追加しました

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

次に、このように使用します

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

2018、JQueryなし（ES6）

すべて無効にするinput：

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

無効にinputするid="my-input"

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

問題はJQuery に関するもので、FYIだけです。

アプローチ4（これはワイルドコーダーの回答の拡張です）

txtName.disabled=1     // 0 for enable

<input id="txtName">

このように使用し、

 $( "#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>

jQuery Mobileの場合：

無効にする

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

有効にする

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