Question

根据标题，我正试图在this jsfiddle中检测到更改事件（在我检查DOM时似乎没有发生）。无线电输入使用引导类进行样式设置。为什么我没有改变？

作为参考，这里有一些代码：

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-sm btn-primary active">
    <input type="radio" name="preview" id="preview-enabled" value="true" autocomplete="off" checked>Alice
  </label>
  <label class="btn btn-sm btn-secondary">
    <input type="radio" name="preview" id="preview-disabled" value="false" autocomplete="off">Bob
  </label>
</div>

单击按钮时，输入无线电不会改变。

我也遇到一个奇怪的错误，即bootstrap的js需要jquery（但是jquery包含在bootstrap的js之前，按the official instructions）

Answer 1

输入radio元素的“checked”属性不会更改（因此不会触发eventListener）;这个元素的underlying DOM property checked会发生变化。

您会认为解决方案是使用MutationObserver监听该节点上DOM属性的更改。但是this doesn't work either，因为它不是DOM中的变化，只是状态变化。似乎（没有使用像React这样的影子DOM框架）没有轮询就无法跟踪它。

在bootstrap 4中检测无线电输入（标签为按钮的标签）的更改事件

1 个答案: