表格提交时的沙漏

Question

我有一个grails应用程序,它解析CSV文件.我有一个表格,当人们上传表格时,它可能需要30秒加上来获得下一页,在此期间只有一个精明或额外的书呆子观察者会注意到该页面正在"等待来自......"

有没有一种快速的方法来放置某种弹出窗口或沙漏或javascript(可能是jQuery)的东西,而不改变窗体的机制？我正在寻找一个快速修复,没有将表单的整个提交迁移到JQuery或其他东西.

在我最初的尝试中,答案似乎是否定的.当点击普通表单提交时,浏览器似乎丢失了禁用javascript的页面.但是,如果响应是SAME PAGE,则javascript将执行,但这对我没有帮助.

像这样的东西:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">jQuery(function(){
  alert("jquery aint buggeed");  //this happens
  $("#submitHandle4JQ").click(function(){alert("BE PATIENT!!");})  //this does not
}); </script>

...

<form action="/path/mySweetGrailsController/parseStuff" method="post" enctype="multipart/form-data" >
<input type="hidden" name="longNumber" value="935762708000464097" id="longNumber" /> 
<input type="file" name="bigFile" />
<input type="submit" text="Upload My File" name="submitHandle4JQ"/><br/>
</form>

Answer 1

试试这个.处理表单时,将一个名为"waiting"的类添加到正文中,然后:

<style type="text/css">
.waiting { cursor: wait; }
</style>

浏览器对游标属性的支持并不完美,但其大部分缺陷都与使用自定义图像的光标有关,而不是使用默认关键字(如"等待"),根据您的操作系统映射到默认图标使用(XP中较低的沙漏,Windows 7中的旋转圆圈,旧Mac OS中的旋转沙滩球等).看到:

http://reference.sitepoint.com/css/cursor

您必须尝试查看这是否适用于足够的浏览器以满足您的需求.

编辑:哦,当你完成等待光标消失时,再次将.waiting课程从身体上移开.