如何在复选框更改时更新禁用的道具？答案

【问题标题】：How to update disabled prop on checkbox change?如何在复选框更改时更新禁用的道具？
【发布时间】：2021-07-17 01:21:28
【问题描述】：

我有一个复选框，用于切换是否将 li 标签添加到列表中。当它被添加到列表中时，其他 li 标签及其关联的复选框（嵌套在 li 标签下）使用 jQuery “禁用”。

该复选框将被禁用，但当我当前取消选中该框时它不会取消禁用。

我尝试了 prop、attr、removeProp/Attr，但都无法再次激活复选框。

$('#id_of_ul_that_holds_li's').on('change', li.active input, function() {

    if ($(this).prop('checked')) {
      $(this).parent().addClasss('checked')
      $(this).children('input').prop('disabled', true)
    }
    else if (!($(this).prop('checked')) {
      $(this).parent().removeClasss('checked')
      $(this).children('input').prop('disabled', false)
    }

  });

【问题讨论】：

if( $(this).is(':checked') )。但请确保您指的是复选框而不是 div
或this.checked...
运行良好。 if 条件运行中的其他所有内容。只有禁用的更新不起作用。
Not in $(this).prop('checked')... 和 div 元素没有本机 checked 属性，因此除非您有人为设置该元素的非本机 checked 属性的代码，我不认为你的if 工作得像你想象的那么好..
请发minimal reproducible example

标签： javascript jquery checkbox attr prop

【解决方案1】：

按照建议：

$("#id_of_div").on('change', "li.active > input[type='checkbox']", function(e) {
  if ($(this).is(":checked")) {
    $(this).parent().addClasss('checked')
    $(this).prop('disabled', true)
  } else {
    $(this).parent().removeClasss('checked')
    $(this).prop('disabled', false)
  }
});

这将检查复选框元素this 是否为checked。查看更多：

【讨论】：

if 条件可以正常工作。它的其他一切都有效。复选框的更新不起作用。复选框未打开（此）
@TaylorDorsett 查看更新。确保你有正确的初始选择器。
@TaylorDorsett 还有一个逻辑错误。如果禁用该复选框，则不能再单击它来执行change 事件；因为它被禁用了。因此，您只能禁用它们，但永远不要单击它们以启用它们。
@TaylorDorsett 您的代码此时没有意义。您正在寻找 DIV 元素上的 Change 事件？您的选择器现在也有语法错误。
@TaylorDorsett Change 事件也不会在 ul 上发生。我确实看到您正在委派input 元素。既然你这样做了，你就不需要打电话给.children()。请查看更新的答案。