jQuery 对话框打开但不关闭!

Question

我正在对一些 HTML 进行 Ajax GET，然后通过以下方式填充 div:

$(theDiv).html(theHtml)

此 HTML 包含一个按钮(假设为“按钮 A”)，该按钮通过以下方式显示 jQuery 对话框:

$(selector).dialog({modal:true});

当点击“按钮A​​”时，每次都会出现该对话框。但是，在对话框中，我添加了一个“取消”链接。取消链接触发:

$(selector).dialog("close")

我注意到大多数时候它的效果都很好。但是，如果我在 Ajax GET 完成后立即快速单击“按钮 A”，取消链接将不会关闭对话框!对话框右上角的“X”按钮始终有效，但“取消”按钮是我遇到的问题。

我尝试了很多不同的方法来让它发挥作用，但都无济于事。这种情况发生在 Firefox 3.5.9 和 IE 7 中。如果我使用 Firebug 并在 .dialog('close'); 语句后放置一个断点，那么我会注意到屏幕从灰色变为白色，但对话框保持打开状态。我什至尝试通过这样做来强制解决这个问题:

$(selector).css("display", "none"); 

没有效果。

无论出于什么原因，第一次 Ajax GET 触发时，我从来没有遇到过这个问题...所以当我第一次访问该页面并执行 GET 时，它每次都有效。但是，如果我留在页面上并在 DOM 仍加载时继续触发 GET，则它可能仅在 50% 的时间内有效。

我非常感谢任何人愿意提供的帮助!

谢谢

安迪

Answer 1

在您单击“取消”按钮时，JavaScript 看起来确实尚未准备好。您应该尝试在ajax加载页面的document.ready事件上弹出警报，如果您能够在警报出现之前单击取消按钮，那么javascript只是比您慢。

只需添加类似的内容:

<script type="text/javascript">
$(function() {
    alert('Javascript ready');
});
</script>