如何獲取疊加層以顯示jQuery UI模式對話框？

Question

在演示中 ，覆蓋層將正確顯示，並且覆蓋層下方的所有元素均被禁用：

<div class="ui-widget-overlay" style="width: 1920px; height: 650px; z-index: 1001;"></div>

但是，當我在頁面中使用代碼時，仍然可以訪問覆蓋圖下方的其他控件。 有關如何解決的任何想法？ 我一直在查看文檔，但對覆蓋實現的了解並不多。

我的代碼：

$("<div title='" + title + "'><div class='ui-state-error ui-corner-all'><p><span class='ui-icon ui-icon-alert'></span><strong>Error: </strong>" + message + "</p></div></div>").dialog({
        resizable: false,
        modal: true,
        draggable: false
    });

Answer 1

您可以將對話框上的zIndex設置為較高的數字來解決此問題：

$("<div title='" + title + "'><div class='ui-state-error ui-corner-all'><p><span class='ui-icon ui-icon-alert'></span><strong>Error: </strong>" + message + "</p></div></div>").dialog({
    resizable: false,
    modal: true,
    zIndex: 100000,
    draggable: false
});