Как удалить атрибут disabled = "disabled" из поля отправки ввода?

#javascript #jquery

Вопрос:

У меня возникли проблемы с удалением disabled="disabled" атрибута из поля ввода.

Вот три метода jQuery, которые я пробовал:

 jQuery('.db_single_lesson .ld-breadcrumbs:first input[type=submit]').removeAttr('disabled');
    jQuery('.db_single_lesson .ld-breadcrumbs:first input[type=submit]').prop('disabled', false);
    jQuery('.db_single_lesson .ld-breadcrumbs:first input[type=submit]').removeProp('disabled');

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" value="Mark Complete" class="abcd" disabled="disabled">

Но не удалось удалить disabled="disabled" атрибут. Может ли кто-нибудь сказать, что не так, или как я могу удалить отключенный атрибут?

Спасибо

1. @AlePlo Я уже пробовал это, и, к сожалению, у меня это не сработало

2. Действительно ли он выбирает элемент? console.log(jQuery('.db_single_lesson .ld-breadcrumbs:first input[type=submit]').length);

3. Да, он выбирает его.

4. Ну .removeAttr("disabled") , должно работать нормально

Ответ №1:

Попробуйте вызвать

 $('.db_single_lesson .ld-breadcrumbs:first input[type=submit]').prop('disabled', '');

Это должно удалить отключенный тег из вашего элемента.

Предполагается, что .db_single_lesson .ld-breadcrumbs:первый ввод [type=submit] является правильным селектором для нужного вам элемента. Из вашего вопроса неясно, правильно ли это для вашей кнопки.

Из вашего вопроса только строка может выглядеть так

 $('input[type=submit]').prop('disabled', '');

Ответ №2:

Давайте посмотрим на селектор…

 .db_single_lesson .ld-breadcrumbs:first input[type=submit]

Этот код ищет некоторый элемент с a db_single_lesson , содержащий другой элемент с ld-breadcrumbs классом, первый ввод которого — тип отправки. У вас нет этих двух содержащих классов. Я добавил их, и ваша первая попытка решения с removeAttr() now работает нормально…

 jQuery('.db_single_lesson .ld-breadcrumbs:first input[type=submit]').removeAttr('disabled');

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="db_single_lesson">
<div class="ld-breadcrumbs">
<input type="submit" value="Mark Complete" class="abcd" disabled="disabled">
</div>
</div>

Ответ №3:

Правильный способ включить кнопку в jQuery будет:

 $('proper selector').prop('disabled', true);

похоже, вы неправильно выбрали кнопку, попробуйте добавить идентификатор для выбора, чтобы протестировать решение самостоятельно. Вместо этого — также для тестирования — измените, возможно, цвет кнопки, чтобы убедиться, что вы выбрали ее правильно.

Основываясь на ваших селекторах, я бы попробовал

 $('input.abcd').prop('disabled', true);

Ответ №4:

Для выбора первого элемента можно использовать .first()

 jQuery('.db_single_lesson .ld-breadcrumbs input[type=submit]').first().removeAttr('disabled');

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<div class="db_single_lesson">
    <div class="ld-breadcrumbs">
        <input type="submit" value="Mark Complete" class="abcd" disabled="disabled">
    </div>
    <div class="ld-breadcrumbs">
        <input type="submit" value="Mark Complete" class="abcd" disabled="disabled">
    </div>
</div>

Ответ №5:

С селекторами проблем не было. Я получал length=1 для селектора. Проблема заключалась в том, что какой-то другой скрипт переопределял мой скрипт jquery и, следовательно, он не работал. Поэтому я вложил свой скрипт в setTimeout функцию с помощью a delay , чтобы получить желаемый результат.

 setTimeout(function(){
        jQuery('.db_single_lesson .ld-breadcrumbs:first input[type=submit]').removeAttr('disabled');
    }, 500);

Спасибо