Bootstrap 模态对话框每次都重新加载

小渣渣

1. <div class="col-md-12">
   
2.         <div class="alert alert-success fade in m-b-15">
   
3.             <strong><button class="btn btn-primary btn-xs" data-toggle="modal" href="/Console/AppendService" data-target="#addservice">添加服务器</button></strong>
   
4.             监控服务器共 2 台
   
5.             <span class="close" data-dismiss="alert">×</span>
   
6.         </div>
   
7.     </div>
   
8.     <!-- 模态框（Modal） -->
   
9.     <div class="modal fade" id="addservice" tabindex="-1" role="dialog"
   
10.          aria-labelledby="myModalLabel" aria-hidden="true">
    
11.         <div class="modal-dialog">
    
12.             <div class="modal-content">
    
13.                 <div class="modal-body">
    
14.                     按下 ESC 按钮退出。
    
15.                 </div>
    
16.             </div><!-- /.modal-content -->
    
17.         </div><!-- /.modal-dialog -->
    
18.     </div><!-- /.modal -->

复制代码

先说下业务需求，我需要点击添加服务器的时候，那个模态窗需要重新加载，

在Bootstrap模态窗的机制中，关闭其实是隐藏，并不是真正的关闭，再点击加载模态窗的时候，就会显示出来，我们可以从网络请求中看到，

只有第一次请求数据了，往后，就再也没有请求数据。

翻阅了许多网站，找到了解决方法。

1. $(function () {
   
2.             $("#addservice").on("hidden.bs.modal", function () {
   
3.                 $(this).removeData("bs.modal");
   
4.             });
   
5.         });

复制代码

添加这么一句话就可以了，大体意思应该是隐藏事件吧，然后清楚数据。

下面是效果，我们可以看出，每次重新打开，都会重新请求了。。。