Question

我发现使用带有引导程序的单选按钮，并使用javascript查询单选按钮的选择时出现问题。问题是当选择单选按钮时，与按钮关联的onclick事件会读取上一个选项，而不是当前选项。

这是我能够创建的MWE（打开控制台以查看问题）：

点击“零”＆＃39; logs True到控制台。点击“零”＆＃39;再次将False记录到控制台。实际上，现在只需点击一下即可查看控制台的日志＆＃39;单选按钮的实际状态。

我已经能够在没有bootstrap.css的情况下重新创建此错误，方法是单击单选按钮本身，而不是单击与单选按钮关联的标签。

似乎在点击标签时，{<1}}方法在更新单选按钮之前被称为。另一方面，单击单选按钮本身时，单选按钮更新后，onclick方法称为。

我的问题是：如何更改js或html以确保我始终可以查询单选按钮的当前状态？

Answer 1

有一种简单而有效的方法可以解决这个问题，通过在onchange事件下为每个输入添加函数，如下所示

<label class="btn btn-primary active">
    <input type="radio" onchange="checkform()" name="number" checked="" id="one" value="One" >One
</label>

onchange事件将在单选按钮更改后触发，而不是onclick事件发生的事件