當(dāng)前位置:軟件學(xué)堂 > 資訊首頁(yè) > 網(wǎng)絡(luò)編程 > 編程其他 > 網(wǎng)站提交信息等待界面代碼怎么寫

網(wǎng)站提交信息等待界面代碼怎么寫

2012/11/14 14:35:33作者:佚名來源:網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例名稱】

網(wǎng)站提交信息等待界面代碼怎么寫

【實(shí)例描述】

網(wǎng)絡(luò)帶寬不足的時(shí)候,如果用戶與服務(wù)器進(jìn)行交互則會(huì)出現(xiàn)白屏或無任何反應(yīng)等問題,這時(shí)可以使用層給予用戶提示,讓等待狀態(tài)不再枯燥。

【實(shí)例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" > <head>     <title>標(biāo)題頁(yè)-學(xué)無憂(www.wangbatian.cn)</title> <script language="javascript"> function Save() {     msg.style.visibility="visible";//顯示 } </script>

需要在body中添加一個(gè)名為“msg”的div層來包裝等待信息, 還有一個(gè)按鈕用來調(diào)用“save”方法,代碼如下所示: </head> <body> <input id="Button1" type="button" value="保存" onclick="Save()" /> <div id="msg" style="position:absolute; z-index:8; width: 300; visibility: hidden"> <table width="300" height="50" border="0" cellspacing="2" cellpadding="0" bgcolor="#FFb609">   <tr>     <td bgcolor="#ccffff">數(shù)據(jù)庫(kù)正在處理數(shù)據(jù), 請(qǐng)稍候...</td>   </tr> </table> </div>     </body> </html>

【運(yùn)行效果】

 提交信息等待界面運(yùn)行效果

【難點(diǎn)剖析】

本例使用了JavaScript與CSS結(jié)合的樣式,通過“style.visibility”來顯示或隱藏提示信息。當(dāng)“visibility”屬性的值為“visible”時(shí)顯示信息,為“hidden”時(shí)則隱藏信息。

【源碼下載】

為了JS代碼的準(zhǔn)確性,請(qǐng)點(diǎn)擊:提交信息等待界面 進(jìn)行本實(shí)例源碼下載 

標(biāo)簽: 提交  代碼