Удалить отключенный атрибут с помощью 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'));
});
Ответы
Ответ 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);
}
}
);
});