Bootstrap Modal ajax內容，動畫加載

我使用Bootstrap Modal通過從另一個頁面加載內容並且數據非常複雜（多查詢/動態表單），所以當打開模式時，它會稍微卡住。Bootstrap Modal ajax內容，動畫加載

我想要一些動畫或指示器來顯示模式沒有崩潰...請稍候。

我必須搜索並嘗試很多方法，但不起作用，在某些解決方案中，當模態加載時，.gif也會卡住。我使用這種方法來實現遠程內容。 http://jsfiddle.net/cp67J/1994/

<!-- Link trigger modal --> 
 
<a href="remote_content.php?id=1" data-toggle="modal" data-target="#myModal" > 
 
    Launch Modal content 1 
 
</a> 
 
<a href="remote_content.php?id=2" data-toggle="modal" data-target="#myModal" > 
 
    Launch Modal content 2 
 
</a> 
 

 
<!--MODAL SECTION--> 
 
<div class="modal fade" id="myModal" role="basic" aria-hidden="true"> 
 
    <div class="modal-dialog"> 
 
     <div class="modal-content"> 
 
      <div class="modal-body"> 
 
       
 
      </div> 
 
     </div> 
 
    </div> 
 
</div>

來源

2016-11-03 Yothin Jetiyanon

請提供您的JS代碼。特別是Ajax代碼 –

我只使用jquery.min.js＆bootstrap.min.js加載模態 –

我的意思是哪個js代碼導致這個模式被打開？你在使用Ajax嗎？ –

不知道如果引導模式支持這一點。但簡單的解決方案將是。

顯示正常模態與加載動畫。
用ajax在後臺加載你的內容。
用加載的數據替換加載器。

P.S.你也可以試驗$ .fn.load並允許jQuery爲你做2和3步。

來源

2016-11-03 11:25:50

Bootstrap Modal ajax內容，動畫加載

回答

相關問題