2017-08-22 68 views
0

這裏是問題的細節:如何在刷新本網站的同時從網站彈出對話框,對話框不會消失?

有一個網站叫做A.通過按網站A上的按鈕,一個對話框顯示出來.10秒後,對話框消失。 我的問題是:網站A實際上每3秒鐘會刷新一次,所以每次按下按鈕時,對話框只能顯示少於3秒,因爲對話框會在網站刷新後立即消失。

網站A具有維持刷新自身以獲得最新的信息,時間INTERCAL不能改變,這是3 sec.But我想保持對話,持續10秒,足夠長的時間讓用戶看到。

我爲什麼不使用AJAX的原因是,我用Python來創造HTML時有產生,以前的網站不能發現html.Only的這種變化後的HTML新information.But通過刷新自己所有的時間瀏覽器能否加載最新的html。但是如果沒有其他方法,我會考慮使用AJAX。

另外我從網上找到了一些其他資源代碼,但所有這些對話框在刷新後都會消失。

任何人都可以有任何想法分享?我真的很感謝你的幫助。非常感謝!

這裏是我的代碼:

<html> <head> <meta http-equiv="refresh" content="3"> 
<title>JavaScript Closing dialog auto.</title> <meta 
http-equiv="content-Type" content="text/html;charset=gb2312"> </head> 
<body>  <input type="button" value="Pop" onClick="Alert('Close 
after 10 sec')"> <script> 

function Alert(str) { 
    var msgw,msgh,bordercolor; 
    msgw=350; 
    msgh=80; 
    titleheight=25; 
    bordercolor="#336699"; 
    titlecolor="#99CCFF"; 
    var sWidth,sHeight; 


sWidth = document.body.offsetWidth; 
sHeight = document.body.offsetHeight;  
var bgObj=document.createElement("div"); 
bgObj.setAttribute('id','alertbgDiv'); 
bgObj.style.position="absolute"; 
bgObj.style.top="0"; 
bgObj.style.background="#E8E8E8"; 
bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75"; 
bgObj.style.opacity="0.6"; 
bgObj.style.left="0"; 
bgObj.style.width = sWidth + "px"; 
bgObj.style.height = sHeight + "px"; 
bgObj.style.zIndex = "10000"; 
document.body.appendChild(bgObj); 

var msgObj = document.createElement("div") 
msgObj.setAttribute("id","alertmsgDiv"); 
msgObj.setAttribute("align","center"); 
msgObj.style.background="white"; 
msgObj.style.border="1px solid " + bordercolor; 
msgObj.style.position = "absolute"; 
msgObj.style.left = "50%"; 
msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif"; 

msgObj.style.marginLeft = "-225px"; 
msgObj.style.top = document.body.scrollTop+(window.screen.availHeight/2)-150 +"px"; 
msgObj.style.width = msgw + "px"; 
msgObj.style.height = msgh + "px"; 
msgObj.style.textAlign = "center"; 
msgObj.style.lineHeight ="25px"; 
msgObj.style.zIndex = "10001"; 
document.body.appendChild(msgObj); 

var title=document.createElement("h4"); 
title.setAttribute("id","alertmsgTitle"); 
title.setAttribute("align","left"); 
title.style.margin="0"; 
title.style.padding="3px"; 
title.style.background = bordercolor; 
title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);"; 
title.style.opacity="0.75"; 
title.style.border="1px solid " + bordercolor; 
title.style.height="18px"; 
title.style.font="12px Verdana, Geneva, Arial, Helvetica, sans-serif"; 
title.style.color="white"; 
title.innerHTML="Info"; 
document.getElementById("alertmsgDiv").appendChild(title); 

var txt = document.createElement("p"); 
txt.setAttribute("id","msgTxt"); 
txt.style.margin="16px 0"; 
txt.innerHTML = str; 
document.getElementById("alertmsgDiv").appendChild(txt); 

window.setTimeout("closewin()",10000); 


} 
function closewin() { 
    document.body.removeChild(document.getElementById("alertbgDiv")); 
    document.getElementById("alertmsgDiv").removeChild(document.getElementById("alertmsgTitle")); 
    document.body.removeChild(document.getElementById("alertmsgDiv")); 
} 
</script> 
</body> 
</html> 
+1

我認爲你應該使用'ajax'來獲取最新信息,避免重新加載頁面 –

+0

如果你的網站像w3schools一樣自我更新,那麼你的代碼有問題。 AJAX,AJAX,AJAX。 – PHPglue

回答

0

我想你需要AJAX,它可以幫你刷新數據,但不會刷新整個頁面A. 這裏有一個關於JS here介紹! 你也可以用jquery來解決它here

+0

謝謝!我終於使用了AJAX並解決了它。 –