如果在模態對話框外單擊，則如何禁用用戶所做的所有單擊

Question

在我當前的項目中，我打開一個單擊按鈕打開的模態對話框，現在如果用戶單擊模態對話框外的任何位置，瀏覽器應忽略單擊，模式對話框應該集中，如何實現？

Answer 1

在顯示模式對話框時禁用單擊背景的標准方法是創建（半）透明div（帶有背景圖像）並使用它來攔截所有點擊。

您的對話框放在此透明div上。

像jQuery這樣的框架為你做這個，所以你不必擔心讓js正確。

看看jQuery模式對話框。

Answer 2

結帳模式對話框和相關技術。 假設您使用jQuery UI作為對話框，則內置該選項。如果沒有，您可以檢查它們的實現。

Answer 3

有一個名為onblur的文檔或窗口的事件，基本上你想要設置一個函數，當用戶點擊其他窗口時，它會將窗口的焦點恢復到彈出窗口。

偽代碼將如下：

    <script>
function bringBackFocus()
{
window.focus();
}
</script>
    <body onBlur="bringBackFocus()">
    </body>

Answer 4

在jqueryui對話框中有一個屬性，你會發現名為Modal將其設置為true它將禁用除對話框之外的所有內容Jquery Ui Dialog Modal Property

或其他方式

$("*:not('#dialog')").on("click",function(){
// do focusing on button or anything you want...
return false;
})