一款表单内容提交加载效果:内容提交中,请等待!当用户提交的时候,会弹出一个信息提示框,让用户等待提交的完成,类似于Ajax的效果,对于想学Ajax的朋友,或许会从本示例中得到启发。
示例:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>内容提交等待</title> </head> <body><script language=javascript> <!-- function showSending() { sending.style.visibility="visible"; } --> </script> <form method="post" action=""><div id="sending" style="position:absolute; z-index:10; width: 400; visibility: hidden"> <table width=400 height=80 border=0 cellspacing=2 cellpadding=0 bgcolor="#8FA8E9"> <tr> <td bgcolor=#eeeeee align=center>内容正在发送, 请稍候...</td> </tr> </table> </div> <table width="95%" border="1" cellspacing="0" cellpadding="1" bordercolorlight="#8FA8E9" bordercolordark="#FFFFFF"> <tr align="center"> <td height="30" class="bg3" colspan="2"> <input type='submit' name='ACTION' value='发送' onClick="showSending()"> </td> </tr> </table> </form> </body> </html><div style="text-align:center;margin:30px 0 0 0;"><hr style="color:#999;height:1px;">如不能显示效果,请按Ctrl+F5刷新本页,更多网页代码:<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></div>提示:可修改后代码再运行!