有無引導模態加載速度更快

Question

我有一個引導模式：

<div class="modal" id="myModal"> ... </div> 

我的JavaScript代碼，顯示模式，然後調用一些表單驗證碼：

$("#myModal").modal("show"); 
doValidation(); 

模態的意圖以防止用戶在表單被驗證時做任何事情。不幸的是，該模式直到驗證完成才顯示出來。我試着將驗證代碼移動到觸發模式打開的事件上，但即使如此，模式仍然不夠快。此外，如果沒有表單驗證代碼，模式仍然會在顯着延遲後顯示，而不是像我想要的那樣立即顯示。我怎樣才能讓模態秀立即顯示？

Answer 1

您可以通過將其display屬性設置爲block（默認情況下爲none）來立即生成模態負載。

把你的CSS如下：

.manually-show-modal { 
    display:block !important; 
} 

然後，這個類動態連接到模式。這可以用角來完成如下：

<div class="modal" ng-class="{'manually-show-modal': show_modal}" id="myModal"> 

範圍初始化：

$scope.show_modal = false; 

莫代爾顯示：

$scope.show_modal = true; 
doValidation(); 

---

時應注意的事項，以這種方法，你不會能夠通過常規手段關閉模態。如果你希望用戶能夠關閉模式，您將需要一個模式關閉按鈕類似如下：

<button ng-click="modalClose()">Close</button> 

在你的角度控制器的以下：

$scope.modalClose = function() { 
    $scope.show_modal = false; 
}