javascript - 在等待结果时禁用 HTML 按钮

标签 javascript html jsp

当我单击 HTML 表单上的提交按钮时,与该按钮相关的函数被调用并开始工作。完成工作后发送邮件通知,这会消耗太多时间。之后,同一 HTML 页面上会显示一条确认消息(不使用 Ajax;即刷新页面)。

我想避免在发送邮件的等待期间,让用户在困惑中多次点击提交按钮。所以我想我应该在按下一次按钮后将其禁用。

我该怎么做?

能否请您推荐任何其他技术来实现此目标而不禁用按钮?

最佳答案

简单地:

<form action="file" method="post" onsubmit="this.submit_button.disabled = true;">
    <input name="submit_button" type="submit" value="Submit" />
</form>

您可以通过使用随机数在不禁用按钮的情况下实现这一点,但它有点复杂。本质上,当用户请求具有将要提交的表单的页面时,为该用户的请求分配一个唯一的 id(将其存储在服务器的某个位置,并确保它与表单一起提交)。然后提交表单时,查找唯一标识以确保它不在处理中或已经处理,然后如果可以继续,将唯一标识标记为“处理中”,处理表单,然后将其标记为处理。如果在进行初始检查时页面正在处理或已经处理,则需要采取必要的操作(如果处理成功,则将它们重定向到确认页面,如果未成功处理,则返回表单).

关于javascript - 在等待结果时禁用 HTML 按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2067042/

相关文章:

html - 菜单不会位于视差图像之上

java - 下载的文件大小 0

java - 使用 java/jsp 的 Internet 连接类型

javascript - 使用 jQuery 提交表单时如何完成 $.get()

javascript - 带有3张图片的css动画

javascript - 为什么浏览器会区分带 www 的 URL 和不带 www 的 URL?

javascript - jQuery:在模糊时隐藏上下文菜单

javascript - 在外部 .js 文件中获取请求属性(作为列表发送)

javascript - 如何在 Angular.js 中找到哪一行代码触发了 $digest 已经在进行中

在每种情况下生成 5 位数字的 JavaScript 表达式