javascript - Bootstrap css 影响单选按钮的行为

我发现在 Bootstrap 中使用单选按钮并获取 javascript 来查询单选按钮的选择时存在问题。问题在于，当单选按钮选择发生变化时，与按钮关联的 onclick 事件会读取上一个选择，而不是当前选择。

这是我能够创建的 MWE(打开控制台以查看问题):

单击“零”将 True 记录到控制台。再次单击“零”会将 False 记录到控制台。事实上，控制台日志现在是单选按钮实际状态“背后”的单击。

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

似乎在单击标签时，onclick 方法在单选按钮更新之前被调用。另一方面，当单击单选按钮本身时，onclick 方法在单选按钮更新后被调用。

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

最佳答案

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

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

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

关于javascript - Bootstrap css 影响单选按钮的行为，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35314561/