为什么 bootstrap 在打开模态内的折叠时触发模态回调

Question

我注意到 bootstrap 2.3.2 中有一个奇怪的行为，我在 modal 中有一个折叠面板。因此，当打开折叠时，模态回调（e.g.show，显示）也会被触发。无法弄清楚为什么会这样。在这里查看 http://www.bootply.com/WHBcMZ6puA#

这是一个错误吗？

Answer 1

我认为事件传播是导致问题的原因。可能（我没有检查 Bootstrap 的代码）模式的设计方式是，如果其 DOM 中的某个元素接收到事件，则执行 'show' 回调，有效地揭示模态弹出窗口。

如果您阻止事件传播，则永远不会执行回调。使用这个，例如：

$('#myModal').find('.accordion-toggle').click(function (e) {
  e.preventDefault();
  e.stopPropagation();
  console.debug('blocked propagation!');
});

希望解释对您有所帮助。这里有我的 Bootply 分支：http://www.bootply.com/cyvZEYufre

Answer 2

这是众所周知的 issue。人们写了一个解决方案，但它不起作用。

$('#myModal').find('.accordion-toggle').on('hidden', function (event) {
    event.stopPropagation()
});

这是命名空间问题，已在 bootstrap 3 版本中解决。我的建议，切换到 bootstrap v3.

为什么 bootstrap 在打开模态内的折叠时触发模态回调

Why bootstrap modal callback fired when a collapse inside modal is opened

javascript

jquery

twitter-bootstrap

twitter-bootstrap-2