如何通過單擊模態窗口外部的任何位置來關閉模態

Question

我目前正在這個網站上。

並且我想添加額外的功能，使用戶可以通過單擊模式框以外的任何位置來關閉模式（可以在灰色子標題的右上角打開）。

現在，僅當我單擊模式框右上角的關閉或黑色背景時，才能關閉模式。

我怎樣才能做到這一點？

Answer 1

您可以將z-index較大值設置為黑色疊加（ #modal-overlay ），以使其顯示在其他元素上方。

出於測試原因，您可以在控制台中測試以下代碼：

$('#modal-overlay').css('z-index', 10000);
$('#modal-name, #modal-movies').css('z-index', 10001);

當然，您應該在CSS中進行設置，並選擇更合理的z-index值;）