13

我正在开发一些 Jquery 对话框,发现当我设置 Modal: true 时对话框被隐藏了。设置 Modal: false 时,我发现一切都按预期工作。希望可以有人帮帮我。

<asp:Button ID="btnOpendialog" runat="server" Text="Button" ClientIDMode="Static" />

<div id="dialog">

<h1>Test</h1>
    <asp:Button ID="btnClickfromDialog" runat="server" Text="Button" />

</div>

$(function () {
    $("#btnOpendialog").click(function (e) {
        $("#dialog").dialog("open");
        return false;
    });

    $("#dialog").dialog({
        height: 200,
        modal: true,
        autoOpen: false,
        open: function () {
            $(this).parent().appendTo($("form:first"));
        }                              
    });
});
4

5 回答 5

15

我修好了它。抱怨这个问题的人并不多。只有我吗?无论如何,这就是我修复它的方法。当你知道怎么做时很简单。

.ui-widget-overlay
{
        z-index: 0;   
}
于 2013-04-24T08:22:35.393 回答
12

我尝试了接受的答案,它似乎在某些情况下有效,但在其他情况下无效。使用相同的想法,这是我想出的代码...

.ui-dialog { z-index: 9999 !important; }

...这是基于 z-index 的.ui-widget-overlay事实9998

此外,为了解决叠加层没有覆盖整个页面高度的问题(因为.ui-widget-overlay只有高度1000%),我想出了这个:

.ui-widget-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; }

于 2015-04-15T15:50:23.197 回答
6

您需要停止像这样使用 appendTo 并使用新的对话框选项“appendTo”

像这样:

$( ".selector" ).dialog({ appendTo: "#someElem" });

取自 jquery-ui 文档 http://api.jqueryui.com/dialog/#option-appendTo

于 2013-06-24T15:09:54.157 回答
4

我需要的所有内容都z-index:1应用于ui-dialog. 没有z-index我可以申请来ui-widget-overlay完成这项工作。

我在 Wordpress 中执行此操作,包括“jquery”、“jquery-ui-core”、“jquery-ui-dialog”脚本。这是我的相关CSS:

.ui-widget-overlay {    
    position: absolute; 
    top: 0; 
    left: 0; 
    width:100%;
    height:100%;
    background: #aaaaaa;
    opacity: 0.3;  
}    

.ui-dialog {    
    background-color: #FFFFFF;    
    overflow: hidden;   
    z-index:1;
}
于 2016-01-15T14:40:40.570 回答
-1

您可以创建一个 jsFiddle 在您的环境之外重新创建此问题吗?如果没有,这里有一些想法来自我的脑海:

将您的 javascript 放在文档就绪块中,如下所示:

$(document).ready(function() {
// Your javascript here...
});

将 btnOpendialog 更改为非 ASP.NET 服务器控件。由于它所做的只是打开 jquery 对话框,因此它不需要成为服务器控件。将其更改为:

<input type="button" id="btnOpendialog" value="Button" />
于 2013-04-23T16:54:42.413 回答