我的场景:
当单击 Dialog1 中的特定元素时,将打开 Dialog2。
当您按 Escape 关闭 Dialog2 时,将按预期工作并关闭 Dialog2。
Dialog1 仍然存在,您可能认为可以通过再次按 Esc 键将其关闭,但事实并非如此。您必须先单击该对话框,然后按 Esc 键才能将其关闭。
这是我尝试过的方法,但没有成功:
// Array to hold all of our open dialogs id's
var openDialogs = [];
// the open: method in my dialog
open: function() {
openDialogs[openDialogs.length] = $(this).attr("id");
}
// the close: method in my dialog
close: function() {
var index = $.inArray($(this).attr("id"), openDialogs),
$previousDialog = (index > 0) ? $("#" + openDialogs[index]) : undefined;
// remove the current dialog from the array via Jon Resig's remove() method
openDialogs.remove(index);
// set focus to previously opened dialog
if ($previousDialog) { $previousDialog.focus(); }
// I've even tried:
//
// if ($previousDialog) { $previousDialog.dialog("moveToTop"); }
}
最佳答案
这一行:
var index = $.inArray($(this).attr("id"), openDialogs),
$previousDialog = (index > 0) ? $("#" + openDialogs[index]) : undefined;
将使$previousDialog
引用当前对话框(正在关闭的对话框)。 index
是正在关闭的对话框的索引。
因此,稍后在这一行:
if ($previousDialog) { $previousDialog.focus(); }
正在关闭的对话框上调用focus()
。
我相信你想要的是这样的:
close: function() {
var index = $.inArray($(this).attr("id"), openDialogs),
$previousDialog = (index - 1 >= 0) ? $("#" + openDialogs[index - 1]) : undefined;
// remove the current dialog from the array via Jon Resig's remove() method
openDialogs.remove(index);
// set focus to previously opened dialog
if ($previousDialog) {
$previousDialog.focus();
}
}
这是一个工作示例:http://jsfiddle.net/L8J7Y/
我还注意到,如果您使用 $previousDialog.dialog("widget").focus();
相反,您可以避免在对话框周围出现可能令人讨厌的虚线。
关于jQuery UI 对话框 closeOnEscape 不适用于多个打开的对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5971462/