javascript - 当有大量数据需要提交时，form.submit()需要更多时间

Question

我们有一个网页，使用户能够撰写和发送电子邮件。我们使用的 HTML 编辑器是 FCK Editor。当他们写完并说发送时

1. 我们会验证电子邮件和主题。
2. 避免用户不进一步操纵表单，我们隐藏整个表单并启用另一个 DIV说“邮件正在发送...请稍候”
3. 我们提交表单

在结果页面中提交完成后，我们说

“邮件发送成功”

如果我们在FCK编辑器中加载大量HTML内容并说发送。结果如下..............

1. 我们验证电子邮件和主题

   这发生得很快

2. 为了避免用户不进一步操作表单，我们隐藏整个表单并启用另一个 DIV，其中显示“邮件正在发送...请稍候”

   该 Div 未启用

3. 我们提交表格

   这需要更多时间来提交。直到表单提交“邮件发送...请 等待”div 未显示。

有什么方法可以解决这个问题，要么提交应该快速发生，要么应该显示 DIV，以便与正在处理的用户进行通信。

有一个名为 main_div 的 DIV，其中我们有

1. 发送至电子邮件 - 文本框
2. 主题 - 文本框
3. HTML 编辑器 - FCK 编辑器
4. 发送 - 按钮

我们有另一个名为loadingDiv的DIV，它有

“邮件发送中...请稍候”

当点击发送时，这里是我们调用的java脚本

函数 sendMailClick(form,temp) {

document.getElementById('main_div').style.display = 'none';

document.getElementById('loadingDiv').style.display = 'block';

form.api.value = 临时；

form.submit();

}

Answer 1

显然负责显示 div 的 JS 代码存在问题。也许它没有正确执行，或者它似乎无法找到 div 元素，或者您用来显示它的方式是错误的？

无论如何，这里有一个应该有效的启动示例:

<form id="form" onsubmit="processSubmit(this);"><input type="submit"></form>
<div id="progress" style="display: none;">submit in progress..</div>

与

<script>
    function processSubmit(form) {
        validate(form);
        form.style.display = 'none';
        document.getElementById('progress').style.display = 'block';
    }
</script>

这基本上就是全部。

使用像 Firebug 这样的 JS 调试器应该会对 JS 代码中发生的事情提供很多新的见解。