javascript - jQuery UI 对话框 - X 秒后关闭

Question

这段代码工作完美，除了 - 对话框窗口不会像我预期的那样在 X 毫秒后关闭......

setTimeout 函数被执行(我把alert()放在那里并且它起作用了...)，所以我假设问题出在$("#alert div").dialog(' close'); 但我不知道出了什么问题......

if ($("#alert").length) {
    var title;
    if ($("#alert span").length) {
        title = $("#alert span").text();
    }
    $("#alert div").dialog({
        title: title,
        modal: true,
        open: function() {
            setTimeout(function() {
                $("#alert div").dialog('close');
            }, 2000);
        }
    });
}

编辑:如果有帮助，这里是 HTML:

<div id="alert">
    <span>Password change</span>
    <div>Password was successfully changed.</div>
</div>

已解决!如果有人知道为什么我的代码不起作用，那就太好了...

Answer 1

您遇到范围界定问题。试试这个jsFiddle example :

if ($("#alert").length) {
    var title;
    if ($("#alert span").length) {
        title = $("#alert span").text();
    }
    $("#alert div").dialog({
        title: title,
        modal: true,
        open: function() {
            var foo = $(this);
            setTimeout(function() {
               foo.dialog('close');
            }, 2000);
        }
    });
}​

发生这种情况并且不像您预期​​的那样工作的原因是您引用成为对话框的目标 div 的方式以及 jQuery UI 构建对话框的方式。如果您查看开发人员控制台，您会发现 jQuery 将您的 div 从 DOM 中的原始位置拉出，因此 #alert div 不再可以引用它，因为它不再是#alert。如果您为该 div 提供了自己的 ID，它将按预期工作，并且您不需要临时变量来引用它。