Ada*_*arr 3 dialog jquery-ui modal-dialog z-index
我需要一次显示2个对话框模态.由于第一个对话框的内容需要使用一些绝对定位和z索引,覆盖的z索引对我来说很重要.
我得到的问题是,如果我在z-index为300时显示第一个模态,则叠加获得301的z-index.如果我然后显示另一个z-index为500的模态,则新叠加获得z-如果我关闭两个模态并再次打开第一个模态,而不是获得z-index为301的叠加,则为503.
这是一些示例代码.
<html>
<head>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#modal').hide();
$('#success-message').hide();
$('#show-modal-button').click(function(){
$('#modal').dialog({
modal: true,
buttons: {
OK: function () {
$(this).dialog("close");
}
},
draggable: false,
title: 'test modal',
resizable: false,
zIndex: 400
});
});
$('#modal-button').click(function(){
$('#success-message').dialog({
modal: true,
buttons: {
OK: function () {
$(this).dialog("close");
}
},
draggable: false,
title: 'test modal',
resizable: false,
zIndex: 500
});
});
});
</script>
</head>
<body>
<input type="button" id="show-modal-button" value="show modal"/>
<div id="modal">
<input type="button" id="modal-button" value="push"/>
</div>
<div id="success-message"><p>test</p></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
更新 我可以通过使用下面的代码关闭时从DOM中删除小部件来实现此功能.我觉得这是一个黑客,它是一个错误或我在我的方法做错了什么.如果没有人能告诉我我做错了什么,我会发布我的解决方案作为答案.
$('#modal-button').click(function(){
$('#success-message').dialog({
modal: true,
buttons: {
OK: function () {
$(this).dialog("close");
$(this).dialog('widget').remove();
}
},
draggable: false,
title: 'test modal',
resizable: false,
zIndex: 500
});
});
Run Code Online (Sandbox Code Playgroud)
通过使用下面的代码关闭时,我可以通过从DOM中删除小部件来实现此功能.我觉得这是一个黑客,它是一个错误或我在我的方法做错了什么.如果没有人能告诉我我做错了什么,我会发布我的解决方案作为答案.
$('#modal-button').click(function(){
$('#success-message').dialog({
modal: true,
buttons: {
OK: function () {
$(this).dialog("close");
$(this).dialog('widget').remove();
}
},
draggable: false,
title: 'test modal',
resizable: false,
zIndex: 500
});
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
31845 次 |
| 最近记录: |