Отключить / включить вход с помощью 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

Вы всегда можете положиться на реальный объект DOM и, вероятно, немного быстрее, чем другие два варианта, если вы имеете дело только с одним элементом:

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

Преимущество использования методов .prop()or .attr()заключается в том, что вы можете установить свойство для нескольких выбранных элементов.

Примечание: в 1.6 есть .removeProp()метод, который звучит очень похоже removeAttr(), но он НЕ ДОЛЖЕН ИСПОЛЬЗОВАТЬСЯ для нативных свойств, таких как 'disabled' Excerpt из документации:

Примечание. Не используйте этот метод для удаления собственных свойств, таких как отмеченные, отключенные или выбранные. Это полностью удалит свойство и после удаления не может быть снова добавлено к элементу. Используйте .prop (), чтобы вместо этих свойств установить false.

На самом деле, я сомневаюсь, что есть много законных применений для этого метода, логические реквизиты выполняются таким образом, что вы должны установить их в false вместо того, чтобы «удалять» их как их «атрибутные» аналоги в 1.5

Просто ради новых соглашений и обеспечения возможности адаптации в будущем (если только с 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 );

Иногда вам нужно отключить / включить элемент формы, такой как input или textarea. 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 или более позднюю версию, используйте prop () вместо attr ().

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

Если вы хотите включить какой-либо элемент, вам просто нужно сделать то, что вы сделали, чтобы отключить его. Однако jQuery предоставляет другой способ удалить любой атрибут.

Подход 1

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

Подход 2

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

Подход 3

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

Опять же, если вы используете jQuery 1.7 или более позднюю версию, используйте prop () вместо attr (). Вот это. Вот как вы можете включить или отключить любой элемент, используя jQuery.

Обновление для 2018 года:

Теперь нет необходимости в JQuery , и это было некоторое время , так document.querySelector или document.querySelectorAll(для нескольких элементов) делают почти точно такую же работу , как $, плюс более явными те getElementById, getElementsByClassName,getElementsByTagName

Отключение одного поля класса «input-checkbox»

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');