Удалить отключенный атрибут с помощью 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'));
});
9 ответов
всегда использовать prop()
метод включения или отключения элементов при использовании jQuery (см. ниже почему).
в вашем случае, это будет выглядеть так:
$("#edit").click(function(event){
event.preventDefault();
$('.inputDisabled').prop("disabled", false); // Element(s) are now enabled.
});
зачем использовать
prop()
когда вы могли бы использоватьattr()
/removeAttr()
для этого?
по сути, prop()
следует использовать при получении или настройке свойства (например,autoplay
, checked
, disabled
и required
среди других).
С помощью removeAttr()
, вы удаляете тег disabled
атрибут сам-в то время как prop()
просто устанавливает базовое логическое значение свойства в false.
в то время как то, что вы хотите сделать можете сделать с помощью attr()
/removeAttr()
, это не значит, что он должны быть сделано (и может вызвать странное / проблемное поведение, как в этом случай.)
следующие выдержки (взятые из документация jQuery для prop ()) объясните эти моменты более подробно:
"разница между атрибутами и свойствами может быть важным в конкретная ситуация. Перед jQuery 1.6,
.attr()
способ иногда учитывал значения свойств при извлечении некоторых атрибутов, что может привести к непоследовательному поведению. Как в jQuery 1.6, в.prop()
метод обеспечивает путь чтобы явно получить значения свойств, в то время как.attr()
получает атрибуты.""свойства обычно влияют на динамическое состояние элемента DOM без изменение сериализованного атрибута HTML. Примеры включают
value
свойство входных элементов,disabled
свойство входных сигналов и пуговицы, илиchecked
свойства чекбокс. The.prop()
способ следует использовать для установкиdisabled
иchecked
вместо.attr()
метод. The.val()
метод должен быть используется для получения и установкиvalue
."
<input type="text" disabled="disabled" class="inputDisabled" value="">
<button id="edit">Edit</button>
$("#edit").click(function(event){
event.preventDefault();
$('.inputDisabled').removeAttr("disabled")
});
снять использовать атрибут disabled,
$("#elementID").removeAttr('disabled');
и добавить использовать атрибут disabled,
$("#elementID").prop("disabled", true);
наслаждайтесь :)
используйте вот так,
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
});
Я думаю, вы пытаетесь тумблер отключенное состояние, в случае ведьмы вы должны использовать это (от этот вопрос):
$(".inputDisabled").prop('disabled', function (_, val) { return ! val; });
Это был единственный код, который работал для меня:
element.removeProp('disabled')
обратите внимание, что это removeProp
, а не removeAttr
.
Я использую jQuery 2.1.3
здесь.
думал, что это вы можете легко настроить
$(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);
}
}
);
});
в этом вопросе конкретно упоминается jQuery, но если вы хотите выполнить это без jQuery, эквивалент в vanilla JavaScript:
elem.removeAttribute('disabled');
2018, без JQuery
Я знаю, что вопрос касается JQuery: этот ответ просто FYI.
document.getElementById('edit').addEventListener(event => {
event.preventDefault();
[...document.querySelectorAll('.inputDisabled')].map(e => e.disabled = false);
});