Отключить / включить вход с помощью jQuery?

Question

$input.disabled = true;

Или

$input.disabled = "disabled";

Какой стандартный способ? И, наоборот, как включить отключенный вход?

javascript jquery html-input disabled-input

2439

omg 12 Сен 2009 в 09:21

Answer 1

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() или .attr() заключается в том, что вы можете установить свойство для нескольких выбранных элементов.

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

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

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

3783

gnarf 25 Июн 2014 в 20:18

Answer 2

В jQuery Mobile:

Для отключения

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

Для включения

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

-1

Peter Mortensen 8 Янв 2018 в 14:27

Answer 3

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

-1

user3831708user3831708 26 Сен 2015 в 10:22

Answer 4

Подход 4 (это расширение ответа дикого кодера)

txtName.disabled=1     // 0 for enable

<input id="txtName">

0

Kamil Kiełczewski 9 Янв 2020 в 18:50

Answer 5

Используйте вот так,

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

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

0

Abdus Salam Azad 31 Окт 2018 в 08:38

Answer 6

2018, без JQuery (ES6)

Отключить все input:

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

Отключить input с помощью id="my-input"

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

Вопрос в с JQuery, это просто FYI.

0

rap-2-h 4 Июн 2018 в 13:52

Answer 7

Я использовал ответ @gnarf и добавил его как функцию

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

Тогда используйте как это

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

0

Imants Volkovs 16 Ноя 2017 в 10:24

Answer 8

Это работает для меня

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

1

learnkevin 22 Фев 2019 в 13:50

Answer 9

Отключить true для типа ввода:

В случае определенного типа ввода ( Пример ввода текста )

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

Для всех типов ввода

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

1

Hasib Kamal 22 Сен 2018 в 07:02

Answer 10

Отключить:

$('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.

1

Tomer Ben David 21 Сен 2018 в 07:04

Answer 11

Вы можете использовать метод 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>

2

SPARTAN 2 Авг 2018 в 10:26

Answer 12

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

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

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

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

Или несколько элементов

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

2

Pawel 11 Фев 2018 в 18:29

Answer 13

Есть много способов их использования, вы можете включить / отключить любой элемент :

Подход 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.

5

wild coder 10 Ноя 2018 в 07:47

Answer 14

Если вы просто хотите инвертировать текущее состояние (например, поведение кнопки переключения):

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

6

daVe 12 Сен 2014 в 16:28

Answer 15

Вы можете поместить это где-то глобально в своем коде:

$.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();

8

Nicu Surdu 26 Окт 2014 в 23:35

Answer 16

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

Или

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

13

Sajjad Shirazy 11 Сен 2014 в 08:33

Answer 17

    // 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- к - disableenable - элемент - with.html

33

Harini Sekar 7 Апр 2014 в 10:27

Answer 18

Просто ради новых соглашений и обеспечения возможности адаптации в будущем (если только с ECMA6 (????) ничего не изменится):

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

А также

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

60

Kedarnath Calangutkar 29 Май 2013 в 12:43

Отключить / включить вход с помощью jQuery?

18 ответов

JQuery 1.6+

JQuery 1,5 и ниже

В любой версии jQuery

Для отключения

Для включения

2018, без JQuery (ES6)

Похожие вопросы

Связанные вопросы

Новые вопросы

javascript