Подтвердить что ты не робот

Удалить отключенный атрибут с помощью JQuery?

Мне нужно сначала отключить ввод, а затем щелкнуть ссылку, чтобы включить их.

Это то, что я пробовал до сих пор, но он не работает:

HTML:

<input type="text" disabled="disabled" class="inputDisabled" value="">

JQuery

$("#edit").click(function(event){
   event.preventDefault();
   $('.inputDisabled').removeAttr("disabled")
});

Это показывает мне true, а затем false, но ничего не изменяется для входов:

$("#edit").click(function(event){
   alert('');
   event.preventDefault();
   alert($('.inputDisabled').attr('disabled'));
   $('.inputDisabled').removeAttr("disabled");
   alert($('.inputDisabled').attr('disabled'));
});
4b9b3361

Ответ 1

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

В вашем случае это будет:

$("#edit").click(function(event){
   event.preventDefault();
   $('.inputDisabled').prop("disabled", false); // Element(s) are now enabled.
});

Пример jsFiddle здесь.


Зачем использовать prop(), если вы можете использовать attr()/removeAttr() для этого?

В принципе, prop() следует использовать при получении или настройке свойств (например, autoplay, checked, disabled и required среди других).

Используя removeAttr(), вы полностью удаляете атрибут disabled, а prop() просто устанавливает для свойства, лежащего в основе значения boolean, значение false.

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

Следующие фрагменты (взятые из документации jQuery для prop()) объясняют эти моменты более подробно:

"Разница между атрибутами и свойствами может быть важна в конкретных ситуациях. Перед jQuery 1.6 метод .attr() иногда учитывал значения свойств при извлечении некоторых атрибутов, что может привести к непоследовательному поведению. Начиная с jQuery 1.6, .prop()метод предоставляет способ явного извлечения значений свойств, в то время как .attr() извлекает атрибуты."

"Свойства обычно влияют на динамическое состояние элемента DOM без изменение сериализованного атрибута HTML. Примеры включают valueсвойство входных элементов, свойство disabled входов и кнопки или свойство checked флажка. Метод .prop()следует использовать для установки disabled и checked вместо .attr()метод. Метод .val() должен использоваться для получения и настройки value".

Ответ 2

<input type="text" disabled="disabled" class="inputDisabled" value="">
​<button id="edit">Edit</button>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

$("#edit").click(function(event){
    event.preventDefault();
    $('.inputDisabled').removeAttr("disabled")
});​

http://jsfiddle.net/ZwHfY/

Ответ 3

удалить отключенное использование атрибута,

 $("#elementID").removeAttr('disabled');

и добавить отключенное использование атрибута,

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

Наслаждайтесь:)

Ответ 4

Используйте это,

HTML:

<input type="text" disabled="disabled" class="inputDisabled" value="">

<div id="edit">edit</div>

JS:

 $('#edit').click(function(){ // click to
            $('.inputDisabled').attr('disabled',false); // removing disabled in this class
 });

Ответ 5

Я думаю, вы пытаетесь переключить отключенное состояние, в этом случае вы должны использовать это (от этот вопрос):

$(".inputDisabled").prop('disabled', function (_, val) { return ! val; });

Вот рабочая скрипка.

Ответ 6

Это был единственный код, который работал у меня:

element.removeProp('disabled')

Обратите внимание, что это removeProp, а не removeAttr.

Я использую jQuery 2.1.3 здесь.

Ответ 7

Подумайте, вы можете легко настроить

$(function(){
$("input[name^=radio_share]").click
(
    function()
    {
        if($(this).attr("id")=="radio_share_dependent")
        {
            $(".share_dependent_block input, .share_dependent_block select").prop("disabled",false);   
        }
        else
        {
            $(".share_dependent_block input, .share_dependent_block select").prop("disabled",true);   
        }
    }
 );
});