是否存在不会暂停脚本的JavaScript警报?

时间:2008-11-19 22:59:14

标签: javascript

我正在寻找像alert()这样的东西,但这并没有“暂停”剧本。

我想显示提醒并允许下一个命令submit()继续。因此,在显示警报后页面将会更改,但不会等到用户单击“确定”。

有这样的东西还是只是其中一件不可能的事情?

6 个答案:

答案 0 :(得分:49)

你可以在setTimeout(非常短暂的超时)中执行警报,因为setTimeout是异步的:

setTimeout("alert('hello world');", 1);

或者为了正确地做到这一点,你真的要在你的setTimeout中使用方法而不是字符串:

setTimeout(function() { alert('hello world'); }, 1);

否则,您将打开JavaScript注入攻击。传递字符串时,它将通过JavaScript eval函数运行。

答案 1 :(得分:3)

如果已经使用JQuery http://docs.jquery.com/UI/Dialog,使用起来很简单,样式很好。

答案 2 :(得分:2)

它可能不是您要找的,但使用window.status ='foo'可能是合适的。

我在一个内部网的webapps中使用了很多。此外,setTimeout方法也可以工作,但如果浏览器忙于执行密集型任务,它也会阻塞。但是状态栏更新始终是立即的。

这确实要求您的观看者具有javascript可以更改状态栏的设置 - 如果它是受信任的站点,则始终如此。

答案 3 :(得分:1)

在这种情况下,使用DHTML和JavaScript动态显示消息更合适,无论是在纯HTML元素中,还是看起来更像是对话框(但不是)。这将为您提供所需的控制权。所有主要的JavaScript框架(YUI,Dojo和其他)都可以让您以异步方式显示消息。

答案 4 :(得分:1)

不可靠。在新页面上使用div。

答案 5 :(得分:1)

98%的时间有一种方法可以移动您的消息脚本,以便在执行其他所有操作后调用它。对于其他2%,我喜欢使用看起来像这样的浮动div。然后,您可以更改CSS以匹配应用程序/网站的样式,或使其看起来更像标准的Windows弹出窗口。

/*HTML*/
<div class="floatingDiv" id="msgBox" style="visibility:hidden"></div>

/*javaScript*/
function openWindow(id){
"use strict";
document.getElementById(id).style.visibility = 'visible'; 
}
function closeWindow(id){
"use strict";
document.getElementById(id).style.visibility = 'hidden'; 
}
function myMsgBox(TITLE,MESSAGE) {
"use strict";   
document.getElementById("msgBox").innerHTML = "<a href=\"javascript:closeWindow('msgBox')\" style=\"float:right\"><img src=\"imgs/close.png\" onmouseover=\"src='imgs/closeOver.png'\" onmouseout=\"src='imgs/close.png'\"/ alt=\"[close]\"></a><h2 style=\"text-align:center; margin-top:0px;\">" + TITLE + "</h2><hr><p align=\"left\">" + MESSAGE + "</p>";
openWindow("msgBox");
}

/*CSS*/
.floatingDiv {
position:absolute;  
z-index:10000;
left:33%;
top:250px;
width:33%;
background-color:#FFF;
min-width:217px;
text-align: left;
border-radius: 10px 10px;
border:solid;
border-width:1px;
border-color:#000;
vertical-align:top;
padding:10px;

background-image: -ms-linear-gradient(top, #CCCCCC 0%, #FFFFFF 25px, #FFFFFF 100%);
background-image: -moz-linear-gradient(top, #CCCCCC 0%, #FFFFFF 25px, #FFFFFF 100%);
background-image: -o-linear-gradient(top, #CCCCCC 0%, #FFFFFF 25px, #FFFFFF 100%);
background-image: -webkit-linear-gradient(top, #CCCCCC 0%, #FFFFFF 25px, #FFFFFF 100%);
background-image: linear-gradient(to bottom, #CCCCCC 0%, #FFFFFF 25px, #FFFFFF 100%);

box-shadow:3px 3px 5px #003; 
filter: progid:DXImageTransform.Microsoft.Shadow(color='#000033', Direction=145, Strength=3);
}