Bootstrap模式未显示,但出现背景

时间:2017-03-06 05:48:09

标签: javascript jquery bootstrap-modal

我有一个代码,当满足某个条件时,在javascript调用模态。现在我的问题是,即使满足条件,模式也不会出现,但背景显示。这是我的js的代码。

if(ExpiredSessionChecker($cookies)){
    console.log("Session has Expired!");
    if ($rootScope.IsForceLogout == 0) {
        $rootScope.IsForceLogout = 1;
        $rootScope.logoutMessage = "Session Expired! Please login again.";
        $('#forcelogout-modal').modal('show');
    }
}else{
    console.log("Session is OK!");
}

这是模态

<div ng-controller="MenuController" id="forcelogout-modal" class="modal fade" data-backdrop="static" data-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
  <div class="modal-dialog modal-md" role="document">
    <div class="modal-content">
        <div class="modal-body">
            <div class="row">
                <!--SUCCESS-->
                <div class="col-md-12  airtime-no-padding" style="background: #F0F0F0;">
                    <div style="margin-bottom: 40px;">
                        <h4>{{ logoutMessage }}</h4>
                    </div>
                    <br>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <a class="pull-right putCursor" ng-click="closeForceLogout()">OK</a>
                </div>
            </div>
        </div>
    </div>
</div>

我对不同的条件有相同的代码,它工作得很好。不知道为什么这些代码不会。 我已经阅读了所有具有相同标题的帖子,但它没有帮助。

1 个答案:

答案 0 :(得分:0)

终于解决了!好像多个并行调用正在导致它。我将代码放置在一个页面加载期间多次调用的函数中,因此如果满足条件,它将多次调用模态。

我将代码放到另一个函数中,每个页面加载只调用一次,现在它正在工作。