Javascript 使用Dojo检测是否未选中所有复选框，禁用按钮

我有一组复选框和一个查询按钮，所以用户可以检查一些东西，然后单击查询按钮进行服务调用以返回记录。如果没有选中任何复选框，如何禁用查询按钮

下面是我写的代码。当我第一次取消选中所有按钮时，查询按钮被禁用。但是当我再次选中其中一个复选框时，“unchecked”数组变为空。请帮忙

\u bindChkChangeEvent:function（）{
var未检查=[]；
on（查询（'.chk'），'change'，lang.hitch（此，函数（事件））{
如果（！event.target.checked）{
if（未选中的.indexOf（event.target.id）<0）
未选中.push（event.target.id）；
}
否则{
if（未选中的.indexOf（event.target.id）>-1）
未选中。拼接（event.target.id）；
}
此._switchQueryBtn（未选中）；
}));
},
_switchQueryBtn:函数（未选中）{
如果（未选中。长度==10）
addClass（this.btnQuery，“disabled”）；
其他的
removeClass（this.btquery，“disabled”）；
}，

在下面的链接一个工作示例中，您可以尝试将此概念应用到您的代码中（不幸的是，问题只包含部分代码视图）

脚本的作用：

• 以编程方式创建两个复选框
• 以编程方式创建按钮
• 为每个复选框添加事件处理程序

  onChange

• 函数

  showHideButton

  实际上包含显示或隐藏按钮的逻辑
• 现在，当页面加载时，两个复选框都被取消选中，

  showHideButton

  运行，按钮被禁用
• 当用户单击复选框时，重新运行函数

  showHideButton

• 此时不满足条件，因为现在选中了一个复选框，所以重新启用按钮

该脚本可以使用任意数量的复选框，只需添加它们的引用并在

showHideButton

函数中修改逻辑即可

注: 您可以使用

dijit/registry

查找小部件的引用，而不是像原始问题中的代码那样使用

dojo/query

直接查询DOM

有关dijit/registry的更多信息，请参见：

---

---

选项0


选择1

在我做了以下更改后工作：unchecked.splice（event.target.id）；到unchecked.splice（unchecked.indexOf（event.target.id）），1；谢谢你的回复。我明白你的代码的意思了。但就我而言，我有十几个复选框，按类查询复选框，然后循环它们似乎更容易。@AlexW我理解你的观点，或者你可以使用registry.toArray（）循环所有小部件，只选择选中的复选框，并在那里应用逻辑。

require(["dijit/form/CheckBox", "dijit/registry", "dijit/form/Button", "dojo/domReady!"], function(CheckBox, registry, Button) {
  new CheckBox({
    id: "checkBox0",
    name: "checkBox0",
    value: "option0",
    checked: false,
    onChange: function(event) {
      showHideButton();
    }
  }, "checkBox0").startup();
  new CheckBox({
    id: "checkBox1",
    name: "checkBox1",
    value: "option1",
    checked: false,
    onChange: function(event) {
      showHideButton();
    }
  }, "checkBox1").startup();
  new Button({
    label: "Click me!",
    onClick: function() {;
    }
  }, "button").startup();

  var showHideButton = function() {
    var checkBox0 = registry.byId('checkBox0'),
      checkBox1 = registry.byId('checkBox1'),
      button = registry.byId('button');
    if (!checkBox0.checked && !checkBox1.checked) {
      button.set('disabled', true);
    } else {
      button.set('disabled', false);
    }
  };
  showHideButton();

});

<input id="checkBox0" />
<label for="checkBox">Option 0</label>
<br>
<input id="checkBox1" />
<label for="checkBox">Option 1</label>
<br>
<button id="button" type="button"></button>