checkbox点击事件仅触发一次，添加bootstrapTable配置后如何修复

问题根因 #

你遇到的现象本质是DOM重绘导致事件绑定失效：
调用bootstrapTable("refreshOptions")方法时，框架会重新渲染整个表格区域的DOM节点，如果你绑定click事件的checkbox位于表格渲染范围内，原有绑定了事件的旧DOM节点会被销毁替换为新节点，旧的事件绑定自然就失效了，所以只会触发一次。

修复方案 #

可以选以下任意一种方式解决：

• 方案1：使用事件委托绑定事件
  不要直接给checkbox绑定click事件，而是把事件绑定到不会被表格重绘影响的上层父元素（比如document或者表格的外层固定容器），通过事件冒泡触发逻辑，就算子节点重绘也不会影响事件触发，示例代码如下：

$(document).on('click', 'input[type="checkbox"]', function(){
  alert('2');
  $("#fresh-table").bootstrapTable("refreshOptions", {
    detailView: false,
  });
})

• 方案2：每次表格重绘后重新绑定事件
  在refreshOptions调用完成的回调中，重新给checkbox绑定click事件，不过这种方式需要重复写绑定逻辑，维护成本更高。
• 方案3：使用bootstrapTable内置事件处理逻辑
  也就是你提到的onColumnSwitch（列切换事件），直接用表格框架提供的内置事件实现需求，这类事件由框架内部维护，不会因为表格重绘失效，是最符合bootstrapTable使用规范的方案。

内容的提问来源于stack exchange，提问作者Richard van Breugel