我有以下代码,我的智慧结束了,因为对话框总是出现在叠加层下面。任何建议都将非常感激:
<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>
答案 0 :(得分: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引用)
答案 1 :(得分:1)
我相信你需要设置shift-edit-popup的位置:
<style type="text/css">
#shift-edit-popup
{
display: none;
position : relative;
}
</style>
答案 2 :(得分:1)
您使用的是哪个版本的jqModal.js?
http://dev.iceburg.net/jquery/jqModal/的最后一个正式版与jQuery 1.4.x不兼容(请参阅http://forum.jquery.com/topic/jqdnr-dragging-problem-with-jquery-1-4和http://www.trirand.com/blog/?page_id=393/bugs/jqgrid-jquery-1-4/)。
如果您的版本“$()”存在于jqModal.js中,则应将其替换为“$(document)”。您还可以下载固定版本作为jqGrid包的一部分:http://www.trirand.com/blog/?page_id=6。
答案 3 :(得分:0)
检查叠加层和模态框的z-index值。
答案 4 :(得分:0)
或许这会对您有所帮助:Understanding z-index
答案 5 :(得分:0)
我很久以前遇到过这样的问题。尝试将DOCTYPE更改为:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">