旧版本的引导模态从第一个模态开始第二个模态时从正文中删除类答案

【问题标题】：Old version bootstrap modal remove class from body on going second modal from first modal旧版本的引导模态从第一个模态开始第二个模态时从正文中删除类
【发布时间】：2016-03-22 17:01:52
【问题描述】：

好吧，最新的引导程序版本没有这个问题。但是，我无法更改现有网站的库版本。因此，我正在尝试为我的项目手动解决该问题。对于早期的 3.x 版本的引导程序来说，这个问题已经很老了。从模态中打开另一个模态从body 中删除.modal-open。我还没有找到解决方案。我尝试的是通过定位第二个模态的 ID 再次添加类：

$(document)
    .on('shown.bs.modal', '#secondModal', function () { $('body').addClass('modal-open') })
    .on('hidden.bs.modal', '#secondModal', function () { $('body').removeClass('modal-open') });

虽然这可行，但这并不是完美的解决方案。因为，在关闭第一个模态时，它会一次又一次地从正文中删除.modal-open，它会在同时打开第二个模态时添加类。但是，删除和添加类的效果是清晰可见的（因为从 body 元素中删除该类会导致双滚动问题），这是我不想要的。我想从第一个模态转到第二个模态，.modal-open 不会被删除。它只会在关闭第二个模态后被删除。如何在不涉及 bootstrap.js 的情况下做到这一点？

Fiddle Demo

【问题讨论】：

标签： twitter-bootstrap bootstrap-modal

【解决方案1】：

更优雅的解决问题的方法是添加和删除overflow，而不是从正文中添加和删除类并且效果根本不可见，这基本上是从第一个切换时滚动条的原因和原因模态到第二个模态。

$(document).ready(function() {
  $('#secondModal').on('show.bs.modal', function() {
    $('body').css('overflow-y', 'hidden');
  });
  $('#secondModal').on('hidden.bs.modal', function() {
    $('body').css('overflow-y', '');
  });
});

注意：当模态即将显示时，第一个事件从shown更改为show，因此滚动条隐藏效果根本不会明显，第二个事件应该是hidden，否则hide你可以看到第二个滚动条出现又消失。

Working Fiddle Example

【讨论】：

不错的解决方案！谢谢。