POST请求正在处理时的进度图标

ser*_*nni 2 html forms ajax post request

有下一个初始条件:

后端:用于文件上传的servlet;

UI:表单,提交用于文件上载的servlet:

<iframe id="uploadFrame" name="uploadFrame"></iframe>
<form enctype="multipart/form-data" method="post" target="uploadFrame" 
      action="<%= request.getContextPath() %>/uploadFile?
      portletId=${portletId}&remoteFolder=${remoteFolder}">
...
</form>
Run Code Online (Sandbox Code Playgroud)

单击此表单的提交按钮时,正在进行文件上载,并且相应地处理POST请求(可以在FireBug中跟踪).

是否可以依赖此POST请求处理进度图标?

我的意思是,如果POST正在处理,该网页应显示进度.gif图标.

也许,有可能使用Prototype lib的Ajax.PeriodicalUpdater函数或其他一些解决方案?

无论如何,看起来,没有ajax是不可能的.

谢谢你的帮助.

Rya*_*ner 7

像Prototype或JQuery这样的东西可能有更清晰的解决方案,但在普通的旧javascript中,应该可以根据表单提交控制进度图标的可见性(或者向DOM添加新的进度图标.这是一个简单的例子.你.我可能想在现实世界中清理一下,以避免像内联样式这样丑陋的东西:

Parent.htm

<script language="javascript">
   function ShowProgress() {
       document.getElementById("progress").style.display = "inline";
   }

   function HideProgress() {
       document.getElementById("progress").style.display = "none";
   }
</script>

<img src="progress.gif" id="progress" style="display: none"/>
<iframe id="uploadFrame" name="uploadFrame"></iframe>
<form enctype="multipart/form-data" onSubmit="showProgress" method="post" target="uploadFrame" >
   ...
</form>
Run Code Online (Sandbox Code Playgroud)

SubmitResponse.htm(您上传表单提交的页面)

<script language="javascript">
  if (parent.HideProgress) {
     parent.HideProgress();
  }
</script>
Run Code Online (Sandbox Code Playgroud)