如何实现表单提交时提示正在发送

来源:风之相随BLOG 时间:2008-12-23 13:30:00 

很简单的方法,但很实用。用过新浪邮箱的朋友应该会知道此脚本的效果。如果您提交的数据处理时间很长,用这个做为提示很不错的.

将下面的代码复制到<head>~</head>里

 程序代码

<script language=javascript>
<!--
function showSending() {
    sending.style.visibility="visible";
    }
-->
</script>

将下面的代码复制到<body>~</body>里

 程序代码

<form method="post" action="../0001/success.asp"><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>

分解说明:

第一步:

先制作一个图层,里面放好你要显示的文件,然后隐藏,如下:

 程序代码

<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>

第二步:

定义表单的提交按钮的Onclike事件:

 程序代码

<input type='submit' name='ACTION' value='发送' onClick="showSending()">

第三步:

将提交按钮的事件定义成Javascript:

 程序代码

<script language=javascript>
<!--
 function showSending()
 {
  sending.style.visibility="visible";    // 修改sending图层的属性为可显示的图层
 }
-->
</script>
标签:提示,表单,脚本,新浪
0
投稿

猜你喜欢

  • 一个简单的JS显示日期代码

    2009-02-10 12:34:00
  • 两行 JavaScript 代码

    2010-08-31 14:57:00
  • 为什么Access数据库的精髓不在VBA之中

    2008-11-28 16:45:00
  • 如何配置一个稳定的SQL Server数据库

    2008-12-09 14:07:00
  • sql不常用函数总结以及事务,增加,删除触发器

    2012-07-11 16:03:42
  • 学习CSS布局心得

    2007-05-11 16:50:00
  • 用XMLHTTPRequest对象进行客户端验证

    2008-03-03 12:38:00
  • 设计中基于人类学的田野调查与比较研究法 ——浅谈用研与竞品分析方法之理论基础

    2009-08-31 16:45:00
  • 什么是响应式Web设计?怎样进行?

    2011-11-21 17:00:40
  • jQuery 横向滚动图片

    2009-03-11 13:09:00
  • asp如何在本地机器上创建缓存?

    2010-06-18 19:27:00
  • X/HTML5 v.s. XHTML2(II)

    2008-06-18 13:19:00
  • 如何在ACCESS中插入超级链接?

    2007-10-22 12:13:00
  • optgroup、sub、sup和bdo标签

    2009-07-26 18:39:00
  • XML卷之实战锦囊(1):动态排序

    2008-09-05 17:20:00
  • SWFObject1.5: 基于Javascript的Flash媒体版本检测与嵌入模块

    2009-08-06 18:02:00
  • 当标题不能显示完整的时候

    2007-11-20 13:23:00
  • ASP 循环导入导出数据处理 不使用缓存

    2010-07-02 12:31:00
  • 教你快速掌握SQL语言中游标的使用技巧

    2009-01-08 16:24:00
  • Dreamweaver制作网页实用七小招

    2009-05-29 18:36:00
  • asp之家 网络编程 m.aspxhome.com