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课程从身体上移开。

Answer 2

如果您已经在使用jQuery，那么我认为BlockUI插件对您有用。您可以使用它来阻止元素或整个页面，并在顶部覆盖消息。该消息是HTML标记，因此它可以包含您通常能够包含在HTML中的任何内容。短信，小时玻璃图形或您能想到的任何其他内容。只需将BlockUI的激活附加到form.submit事件即可。

http://jquery.malsup.com/block/

Answer 3

我知道这很老了，但是在堆栈溢出时我找不到最近的答案-必须求助于Code Ranch

开始时使用javascript

document.body.style.cursor = 'wait';

JavaScript在流程结束时

document.body.style.cursor = 'default';

表格提交时的沙漏

3 个答案: