jQuery -当一个人被关闭/被摧毁时，对话框消失。
我正在构建一个广泛使用jQuery UI对话框的应用程序。当我同时打开多个对话框时，我遇到了一个问题，如果可能的话，我无法真正解决它。
基本上，是这样的：
- User打开对话框
A(顶部:100 up，高度:300 up) - 用户打开对话框
B(顶部:100 up，高度:300 up)， - 用户关闭对话框
A后打开的对话框A。对话框Btop属性减缩对话框Aheight(100 e.g.300 property =-200 property)：对话框消失.
我通过使用Firebug检查和Web开发人员得出了这个结论。
如果首先关闭了对话框B (在对话框A之后打开)，则不会出现问题。我也尝试过使用一个普通的UI (即:除了jQuery的loaded之外没有样式表)，这种情况仍然存在。当对话框关闭时，似乎会有一个触发器，而我无法覆盖。
使用 position: fixed; (按照 @TheVillageIdiot 的建议)修复它，但是当对话框被销毁时仍然会发生。
下面是一个例子：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<link type="text/css" rel="stylesheet" media="all" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>
<body>
<div id="dialog-1">
</div>
<div id="dialog-2">
</div>
<script type="text/javascript">
$('#dialog-1').dialog({
close: function() {
$(this).dialog('destroy');
},
height: 300,
position: [100, 100],
show: 'scale',
hide: 'drop',
resizable: false,
title: 'A',
});
$('#dialog-2').dialog({
close: function() {
$(this).dialog('destroy');
},
height: 300,
position: [100, 100],
show: 'scale',
hide: 'drop',
resizable: false,
title: 'B',
});
</script>
</body>
</html>任何建议都是非常感谢的。
回答 2
Stack Overflow用户
发布于 2011-07-21 00:57:28
这可能是因为您的对话框不在position: absolute中，因此对话框B的位置(即顶部:X)相对于对话框A的位置(top:Y)计算。
假设对话框B的绝对位置是top: 20px，对话框A的位置是top: 10px，对话框B的指定位置将是top: 10px，因为它相对于对话框A。因此，当对话框A被破坏时，对话框B (top: 10px)的位置变得相对于对话框A之前的元素，很可能更高，因此在窗口中向上移动。
解决方案非常简单:将对话框CSS position属性设置为absolute。jQuery UI应该赶上并正确计算位置。
P.S.：只需确保在加载jQuery UI CSS样式表后定义您的CSS绝对位置，以确保您的CSS覆盖jQuery。
Stack Overflow用户
发布于 2011-07-20 18:10:26
从UI的角度来看，我有点担心您同时触发多个对话框。在UI模式中，一些研究已经得出结论，一个模态对话框是非常具有破坏性的，所以理想情况下，它可以用于这样一种情况，即您必须中断其余的过程，以使某些事情发生或警告用户。一个接一个的对话框可能会在一个模式下更好地完成，比如在一个非模式环境中的向导。
或者，有多个通知小部件可以很好地完成这类任务。例如：
http://www.erichynds.com/examples/jquery-notify/
http://www.thinkbohemian.com/2010/04/22/stack-overflow-style-notifications-using-jquery/
好的，尽管如此，我已经做了几次，特别是当我提醒用户进程正在发生，然后告诉他们进程已经成功/失败时。解决方案不是两者都抛出，而是销毁其中一个，然后依次实例化另一个。这可以通过单击jQuery对话框代码本身中的按钮来实现，在需要用户交互的情况下，也可以通过服务器端脚本“告诉”用户界面在通知进程时销毁其中一个并构建另一个。无论哪种方式，实例化一个脚本的目的是创建一个单一的元素多次，然后期待它的“堆栈”是邀请所有的浏览器问题(咳嗽，咳嗽IE)的错误。
https://stackoverflow.com/questions/6766254
复制相似问题
腾讯云开发者
