多个堆叠模态bs3中的ESC键导致错误

Question

我有一个可以在bootstrap3上正常运行的应用程序，它可以一次打开各种模态，并且我想在一个打开的模态上添加另一个模态（我知道bootstrap3上的多个模态的问题）。

我找到了可以使用的jsfiddle。

当用户按下“ ESC”键，底部的模态关闭时，出现问题！我想关闭顶部的模态.....

有人能告诉我一个只开放两个模态的提示吗？

$(document).ready(function() {

  $('#openBtn').click(function() {
    $('#myModal').modal({
      show: true
    })
  });

  $(document).on({
    'show.bs.modal': function() {
      var zIndex = 1040 + (10 * $('.modal:visible').length);
      $(this).css('z-index', zIndex);
      setTimeout(function() {
        $('.modal-backdrop').not('.modal-stack').css('z-index', zIndex - 1).addClass('modal-stack');
      }, 0);
    },
    'hidden.bs.modal': function() {
      if ($('.modal:visible').length > 0) {
        // restore the modal-open class to the body element, so that scrolling works
        // properly after de-stacking a modal.
        setTimeout(function() {
          $(document.body).addClass('modal-open');
        }, 0);
      }
    }
  }, '.modal');
});

这是我正在工作的代码

非常感谢您的帮助！