Checkbox RadioButton行为

Question

我正在尝试将bootstrap主题实现为OpenLayers Layer Switcher控件的新风格 在bootstrap示例中，我注意到 input 元素嵌套在 label 元素中，如下所示：

<label class="radio span2">
    <input type="radio" value="option1">
    Cash
</label>
<label class="radio span2">
    <input type="radio" value="option2">
    Invoice
</label>
<label class="radio span2">
    <input type="radio" value="option3">
    Discover
</label>

当您点击单选按钮的标签时，它会被检查但不会被触发。但是当你点击收音机本身时，它会被触发。使用复选框也会发生同样的情况。但即使选中了复选框，也不会触发点击事件。

您可以查看代码here

我该如何解决这个问题？

Answer 1

您已为控件注册了click事件处理程序。如果不单击控件，则不会调用处理程序。

当标签与元素相关联时，单击它将“激活”该元素。如果是复选框或单选按钮，则表示检查/选中它。

复选框也可以通过其他方式更改，例如键盘。因此click事件处理程序不是最佳选择。请改用change事件。