我的代码正在做一些非常昂贵的事情 - 构建一大堆 UI 元素 - 所以我想显示一个对话框来表示“请稍候”。
这显然不起作用:
$(function () {
$("#pleasewaitdialog").dialog({
'modal': true,
'autoOpen': false,
});
alert("test program started");
// open the dialog
$("#pleasewaitdialog").dialog("open");
// simulate doing something expensive;
for (var i=0; i<500000000; i++);
// close the dialog
$("#pleasewaitdialog").dialog("close");
alert("test program ended");
});
UI 不会更新,因为它被阻止执行 for 循环。
我尝试过这个:
$(function () {
$("#pleasewaitdialog").dialog({
'modal': true,
'autoOpen': false,
});
alert("test program started");
// open the dialog
$("#pleasewaitdialog").dialog("open");
setTimeout(function () {
// simulate doing something expensive;
for (var i=0; i<500000000; i++);
// close the dialog
$("#pleasewaitdialog").dialog("close");
alert("test program ended");
},1);
});
这实际上在 Safari 中工作正常(在 JQueryUI 对话框显示的两个警报之间)。但在 Chrome(Mac 为 10.0.648.127)中,jQuery UI 对话框不显示。 [更新:实际上,这个解决方案是有效的。您需要确保它没有出现在带有损坏的 <title>
的文档中。标记头脑(见下面的答案)]
最佳答案
如果 <title>
损坏,jQueryUI(jQuery 1.5.1 和 jQueryUI 1.8.10)将不会在 Chrome(10.0.648.127、Mac)中显示对话框。由于某种原因标记。
以下代码在 Safari 中运行良好,但在 Chrome 中不起作用。
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/themes/smoothness/jquery-ui.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js"></script>
<script>
$(function () {
$("#pleasewaitdialog").dialog({
'modal': true,
'autoOpen': false,
});
alert("test program started");
// open the dialog
$("#pleasewaitdialog").dialog("open");
setTimeout(function () {
// simulate doing something expensive;
for (var i=0; i<500000000; i++);
// close the dialog
$("#pleasewaitdialog").dialog("close");
alert("test program ended");
},1);
});
</script>
<!-- the broken close title tag here means that the
jQuery dialog below won't display on Chrome -->
<title>Test Dialog</tile>
</head>
<body>
<div id="pleasewaitdialog" title="Please Wait">Reticulating Splines</div>
</body>
</html>
关于javascript - 当主线程中执行长时间运行的内容时,如何让 jQueryUI 显示对话框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5246259/