Jquery 对话框'；s close事件触发焦点事件并导致无休止的循环

我将我的应用程序移动到最新的jQueryUI版本，现在行为已经改变。也就是说，在打开对话框时，会对具有焦点的元素调用模糊事件。当对话框关闭时，将再次调用该元素的焦点事件。以前的jQuery版本没有调用这些事件

问题是，我正在焦点事件中打开对话框，关闭它，因此再次调用焦点，并出现无休止的循环

我怎样才能防止这种无休止的循环

编辑：

我不能在一个简单的jsfiddle中得到它，最好的是这个

试验
$（文档）.ready（函数（）{
$（“#对话框”）。对话框({
自动打开：错误，
身高：120，
宽度：185，
职位：[285200]，
莫代尔：是的，
按钮：{
“Ok”：函数（）{
$（此）.dialog（“关闭”）
}
}
});
$（“#测试”）。焦点（函数（事件）{
$（“对话框”）。对话框（“打开”）；
});
});

这里没有无休止的循环，但你可以看到关闭对话框后，页面（结果）被打破，因为一切都“模糊了”

另外，旧的行为更像这样：

---

这里的背景仍然“模糊”，但您可以将焦点集中到新版本无法实现的输入中。

您是否考虑过设置关闭状态，然后检查它

如果在对话框关闭时，您设置了类似于

$（“#test”）.data（'coming-from-dialog'，true）

，则焦点处理程序可能类似于：

$("#test").focus(function (event) {
    var test = $(this);
    if(!!test.data('coming-from-dialog')) {
        // clear state for next focus
        $this.data('coming-from-dialog', false);
        return;
    }

    $("#dialog").dialog("open");
});

---

当然，您也可以在对话框关闭时将焦点放在关闭时的其他内容上，或者单击文档正文等来清除焦点。

我不能说这是否适用于早期的jQueryUI版本，但是

关闭对话框后，焦点将自动返回到元素 对话框打开时具有焦点的

---

似乎应该使用其他事件打开对话框

尝试使用单击而不是焦点。这应该起作用：

为了改善用户体验，您可能需要执行以下操作：

var idOfTheElementLastModalWasOpenedFor = null;
$(":focusable:not(#test)").focus(function() {
    idOfTheElementLastModalWasOpenedFor = null;
});

function openMyModal(event) {
    $thisID = $this.attr("id");
    if(event.type == "click" || idOfTheElementLastModalWasOpenedFor != $thisID){        
        idOfTheElementLastModalWasOpenedFor = $thisID;
        $("#dialog").dialog("open");
    }
};    

$("#test").focus(openMyModal);
$("#test").click(openMyModal);

---

我在blur事件中设置了一个控制变量：这对键盘导航或屏幕阅读器用户没有帮助。

$("#test").click(function (event) {
    $("#dialog").dialog("open");
});

var idOfTheElementLastModalWasOpenedFor = null;
$(":focusable:not(#test)").focus(function() {
    idOfTheElementLastModalWasOpenedFor = null;
});

$("#test").focus(function (event) {
    thisID = $this.attr("id");
    if(idOfTheElementLastModalWasOpenedFor != thisID){        
        idOfTheElementLastModalWasOpenedFor = thisID;
        $("#dialog").dialog("open");
    }
});

var idOfTheElementLastModalWasOpenedFor = null;
$(":focusable:not(#test)").focus(function() {
    idOfTheElementLastModalWasOpenedFor = null;
});

function openMyModal(event) {
    $thisID = $this.attr("id");
    if(event.type == "click" || idOfTheElementLastModalWasOpenedFor != $thisID){        
        idOfTheElementLastModalWasOpenedFor = $thisID;
        $("#dialog").dialog("open");
    }
};    

$("#test").focus(openMyModal);
$("#test").click(openMyModal);