twitter-bootstrap - 单击浏览器后退按钮时, Bootstrap 模式关闭但模式下拉保持

标签 twitter-bootstrap backbone.js modal-dialog

我正在使用带有 Bootstrap 的 Backbone。问题是当您浏览应用程序并且在某些时候打开 Bootstrap 模式窗口并按下后退按钮时,模式窗口关闭但模式背景 div(模式背景)保持不变并且不会消失。它覆盖整个屏幕,你不能点击任何东西。我注意到,当您关闭模态时,模态背景 div 通常会从 html 中删除,并且在这种情况下它会保留下来。

我在网上搜索这个解决方案,发现了类似的东西,但没有一个是按下浏览器后退按钮的潮流。

我想过捕获浏览器后退按钮事件和用户 jquery 以删除该 div,但这并不是一个很好的解决方案。

有人可以指出这个问题的一些解决方案吗?或者最后告诉我为什么会这样。

编辑:
按下后退按钮时,模态不会引发 hide.bs.modal 事件,因此我无法捕捉并删除模态背景 div

最佳答案

我们在使用 AngularJS_v1.4.7 和 Bootstrap_v3.0 开发的 Web 和移动应用程序中遇到了这个问题。
预期的行为(在整个应用程序中)是 Popup 应该关闭并且页面转换不应该发生。换句话说,后退按钮只是关闭弹出窗口,没有别的。

下面的修复工作正常,

//Detect location change
$rootScope.$on('$locationChangeStart', function(event, newUrl, oldUrl) {
        // Select open modal(s)
        var $openModalSelector = $(".modal.fade.in"); 
        if( ($openModalSelector.data('bs.modal') || {}).isShown == true){
            // Close open modal(s)
            $openModalSelector.modal("hide");
            // Prevent page transition
            event.preventDefault();
        }
    });

此修复已成功测试,
  • 桌面上的 Chrome 浏览器
  • Windows 8.1 电话
  • 安卓 Lollipop
  • 关于twitter-bootstrap - 单击浏览器后退按钮时, Bootstrap 模式关闭但模式下拉保持,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25762400/

    相关文章:

    javascript - DateTimePicker 类预约系统

    javascript - Bootstrap 导航栏切换按钮不起作用

    javascript - 如何使用 Backbone.js 捕获表单提交

    javascript - 为 backbone.marionette 创建一个全局模型

    ios - Twitter API 发生错误?

    css - 轮播的重置定时器间隔

    javascript - Backbone.js 在切换 View 时打破每个循环

    django - django表单提交后触发引导模式

    javascript - 如何制作具有不同内容的模态

    javascript - Meteorjs Foundation 模态事件卡住浏览器