3

我有以下代码,因为对话框总是出现在覆盖层下,所以我束手无策。任何建议将不胜感激:

<head runat="server">
    <title></title>
    <link href="../Styles/jqModal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        #shift-edit-popup
        {
            display: none;
        }
    </style>
    <script src="../Scripts/jquery-1.4.2.js" type="text/javascript"></script>
    <script src="../Scripts/jqModal.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#shift-edit-popup").jqm({
                toTop: true
            }).jqmAddTrigger("#show-button");
        });
    </script>
</head>
<body>
    <form id="form" runat="server">
    <input id="show-button" type="button" value="Show" />
    <div id="shift-edit-popup">
        <div>
            <asp:Label ID="resourceLabel" runat="server" AssociatedControlID="resourceList">Resource:</asp:Label>
            <asp:DropDownList ID="resourceList" runat="server" DataTextField="Name" DataValueField="ResourceId" Width="120px">
            </asp:DropDownList>
        </div>
    </div>
</body>
4

6 回答 6

2

从我看到并尝试过的情况来看,您需要在对话框 div 上使用包含的 jqmWindow 类并删除以下内容:

<style type="text/css">
    #shift-edit-popup
    {
        display: none;
    }
</style>

您的代码应如下所示:

<head runat="server">
    <title></title>
    <link href="Scripts/jqModal.css" rel="stylesheet" type="text/css" />

    <script src="Scripts/jquery-1.4.2.js" type="text/javascript"></script>
    <script src="Scripts/jqModal.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#shift-edit-popup").jqm({
                toTop: true,
                modal: true
            }).jqmAddTrigger("#show-button");
        });
    </script>
</head>
<body>
    <form id="form" runat="server">
    <input id="show-button" type="button" value="Show" />
    <div id="shift-edit-popup" class="jqmWindow">
        <div>
            Resource:
            <select><option value="1">One</option><option value="2">Two</option></select>
        </div>
    </div>
</body>

(您只需要相应地更改脚本和 css 引用)

于 2010-05-04T16:07:18.137 回答
1

我相信您需要设置 shift-edit-popup 的位置:

<style type="text/css">
    #shift-edit-popup
    {
       display: none;
       position : relative;
    }
</style>
于 2010-05-04T14:07:58.637 回答
1

您使用哪个版本的 jqModal.js?

来自http://dev.iceburg.net/jquery/jqModal/的最新官方版本与 jQuery 1.4.x 不兼容(参见http://forum.jquery.com/topic/jqdnr-dragging-problem-with-jquery -1-4http://www.trirand.com/blog/?page_id=393/bugs/jqgrid-jquery-1-4/)。

如果在您的版本中,jqModal.js 中存在“$()”,则应将其替换为“$(document)”。您还可以下载固定版本作为 jqGrid 包的一部分:http ://www.trirand.com/blog/?page_id=6 。

于 2010-05-06T15:54:51.573 回答
0

也许这将有助于阅读:了解 z-index

于 2010-05-04T02:16:12.857 回答
0

不久前我遇到了这样的问题。尝试将 DOCTYPE 更改为:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
于 2010-05-07T01:16:19.823 回答
0

检查叠加层和模态框的 z-index 值。

于 2010-04-30T14:51:44.923 回答