我有一個 Bootstrap 3 模式，它有條件地需要向左移動，以便在打開對話框時仍然可以看到主頁上的資料。
如果 a<div>出現在具有 的模態中，則模態應該出現在視窗的左側。否則，它應該在螢屏的頂部中心正常呈現。
我正在使用 Yii2 Modal 小部件。
use yii\bootstrap\Modal;
Modal::begin([
'header' => '<h4 id="title"></h4>',
'options' => [
'id' => 'modalCreate',
],
]);
echo "<div class=modal-body id='modalContent'></div>";
Modal::end();
模式中的內容是使用 Ajax 附加的。附加內容的 Javascript 如下所示：
$(function(){
$(document).on('click', '.btn-modal', function() {
var modal = $('#modalCreate').modal('show');
modal.find('#modalContent').load($(this).attr('value'));
var title = $(this).attr('data-title');
});
});
實際定位代碼在視圖檔案中：
$('#modalCreate').on('shown.bs.modal', function () {
if ($('.modal-left').length) {
$('.modal-dialog').css("margin-left", '30px');
} else {
$('.modal-dialog').css("margin-left", 'auto');
}
});
在我的測驗系統上，這作業正常，雖然有點笨拙。我不得不使用shown.bs.modal，因為在方法完成<div >之前不存在。.load()
問題是在生產服務器（異地 VPS）上，它不能正常作業。它似乎落后了一步，所以我假設負載在所示的甚至觸發之前還沒有真正完成。我應該檢查不同的事件，還是有人有其他建議？
提前致謝，
喬
uj5u.com熱心網友回復：
在您的代碼中，您開始打開模式，然后立即開始加載其內容。模式顯示不等待內容加載。而且，內容加載也不等待模態。所以基本上是賭先完成什么。
您可以使用load()方法的完整回呼在其內容加載后開始顯示模式：
$(document).on('click', '.btn-modal', function() {
var modal = $('#modalCreate');
modal.find('#modalContent').load($(this).attr('value'), function() {
modal.modal('show')
});
var title = $(this).attr('data-title');
});
另一種選擇要復雜一些。您可以創建兩個Promises，一個在事件處理程式中決議shown.bs.modal，另一個在加載的完整回呼中決議。當兩個 Promise 都解決時，您可以運行定位代碼。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/443698.html