Checkbox 选中其他复选框时自动取消选中复选框

我与XUL合作，我有两个HBox，每个HBox中有一个复选框：

<hbox id="hBox1">
   <label value="label1" style="width:15ex" />
   <spacer style="width:5px" />
   <checkbox id="checkBox1" style="width: 2ex" />
</hbox>

<hbox id="hBox2">
   <label value="label2" style="width:15ex" />
   <spacer style="width:5px" />
   <checkbox id="checkBox2" style="width: 2ex" />
</hbox>

我希望有这样的行为：只能选中两个复选框中的一个，即如果用户选中一个复选框，而另一个复选框被选中，那么第二个复选框必须自动取消选中

我试过这个：

<checkbox id="checkBox1" style="width: 2ex" onchange="if (this.checked) document.getElementById('checkBox2').checked = false" />

<checkbox id="checkBox2" style="width: 2ex" onchange="if (this.checked) document.getElementById('checkBox1').checked = false" />

---

但是它不起作用

当您应该使用

concommand

时，您正在使用

onchange

以下工作：

<hbox id="hBox1">
   <label value="label1" style="width:15ex" />
   <spacer style="width:5px" />
   <checkbox id="checkBox1" style="width: 2ex" oncommand="if (this.checked) document.getElementById('checkBox2').checked = false" />
</hbox>

<hbox id="hBox2">
   <label value="label2" style="width:15ex" />
   <spacer style="width:5px" />
   <checkbox id="checkBox2" style="width: 2ex" oncommand="if (this.checked) document.getElementById('checkBox1').checked = false" />
</hbox>

按钮专门用于允许单个选择 这通常通过内部的实现<代码>框放置在

中时自动具有此行为。它们的样式通常有点不同（圆形，而不是方形），但如果您愿意，可以使用CSS进行更改。但是，圆形样式旨在向用户提供信息，说明它是一个单选按钮并且具有此行为

<hbox>
  <vbox>
    <radiogroup>
      <radio id="checkBox1" dir="reverse" label="label1" style="width: 21ex" />
      <radio id="checkBox2" dir="reverse" label="label2" style="width: 21ex" />
    </radiogroup>
  </vbox>
</hbox>

<hbox>
  <vbox>
    <radiogroup>
      <radio id="checkBox1" dir="reverse" label="label1" style="width: 21ex" />
      <radio id="checkBox2" dir="reverse" label="label2" style="width: 21ex" />
    </radiogroup>
  </vbox>
</hbox>