2008-11-19 56 views
23

我正在尋找類似alert()的東西,但那不會「暫停」腳本。是否存在不會暫停腳本的JavaScript警報?

我要顯示一個警告,讓下一個命令,一個形式submit(),繼續。因此,顯示警報後頁面將發生更改,但不會等到用戶單擊確定。

有沒有這樣的事情,或者它只是這些不可能的事情之一?

回答

44

你可以做一個setTimeout的警報(這很短的超時)作爲setTimeout的是異步的:

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

或者做正確,你真的表明使用的方法,而不是一個字符串到您的setTimeout:

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

否則你會打開自己的JavaScript注入攻擊。當你傳遞一個字符串時,它會通過JavaScript eval函數運行。

+7

不要傳遞一個字符串setTimeout,傳遞一個函數。 setTimeout(function(){alert('hello world');})更好 - 函數是Javascript中的一級對象 – Gareth 2008-11-20 00:16:09

+0

是的,我知道我應該做它作爲一個函數,而不是一個字符串被評估。 – 2008-11-20 00:51:45

+6

該解決方案不適用於Chrome,即使在setTimeout中,警報也會暫停所有瀏覽器腳本。 – Anas 2015-12-15 12:55:16

1

在這種情況下,這將是更合適的是使用DHTML和JavaScript來動態地顯示一個消息,無論是在一個普通的HTML元素,或一些看起來更像一個對話框(但不是)。這會給你你需要的控制。所有主要的JavaScript框架(YUI,Dojo和其他)都將使您能夠異步顯示消息。

1

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

2

它可能不是你要找的東西,但它可能是適合使用window.status =「富」。

我在我的一個Web應用程序中使用了很多內部網。此外,setTimeout方法也可以工作,但如果瀏覽器忙於執行密集型任務,它可能會阻止。但狀態欄更新始終是立即的。

但這也需要你的觀衆有一個JavaScript可以改變狀態欄的設置 - 總是這樣,如果它是一個受信任的站點。

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); 
}