Метод jQuery prop () работает, но не добавляет атрибут «отключен» к элементу

Question

Я пытаюсь отключить кнопку для предотвращения добавления новых строк в таблицу.Моя проблема в том, что метод prop() работает нормально, но не отключает кнопку (я не могу добавить новые строки, он работает нормально, но кнопка все еще щелкает и выглядит как «активная» (а атрибут «отключен» не добавлен в мойкнопка)).

Если я использую attr("disabled", "disabled") вместо prop("disabled", true), это нормально работает и кнопка отключается (атрибут «отключен» добавлен к элементу), но я прочитал, что использовать attr() плохо после JQuery1.6 +.

var addBtn = $(".k-grid-add");
addBtn.bind("click", function () {
    if (grid.dataSource.data().length == 9) {
        $(addBtn).prop("disabled", true);          // <- work, but button still "active"
        // $(addBtn).attr("disabled", "disabled"); // <- work fine
    }

Что я делаю не так?Спасибо!

Answer 1

Это работает для меня!Просто посмотрите, что я проверял ....

addBtn = $("#btn");
addBtn.prop("disabled", true);

addBtn.on("click",function() { console.log(999); });

//
enable.onclick = function() {
 addBtn.prop("disabled", false);
}

// 
disable.onclick = function() {
  addBtn.prop("disabled", true);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btn">sdf</button>

<button id="enable">Enable</button>
<button id="disable">Disable</button>

Answer 2

Я не могу это проверить, это должно работать.Вот часть моего кода, который работает, если я ввожу более 6 символов, кнопки активны, если я удаляю его, кнопки отключаются.Какую версию jQuery вы используете?Кроме того, использование bind не рекомендуется в версии jQuery> 3.0, использование element.on() будет более надежным в будущем (http://api.jquery.com/bind/).

$commentsInput.on('input.UECommenting', function (event) {
    let buttonsDisabled = $commentsInput.val().length < 7 ? true : false;
    for (let button in $commentingButtons) {
        $commentingButtons[button].prop({ 'disabled': buttonsDisabled, 'title': buttonsDisabled ? 'No comments without content!' : '' });
    }
});

И я должен рекомендовать привыкнуть использовать пространства имен для событий, счто вы можете легко использовать element.off('.namespace'), чтобы гарантировать, что ваши события не будут устанавливаться и запускаться несколько раз.

Answer 3

Поскольку disabled является логическим атрибутом, его необходимо установить следующим образом: disabled="disabled":

$(addBtn).prop("disabled", "disabled");