javascript - 如何在 javascript 中等待服务器响应时禁用表单提交？

Question

我有一个表格

<form method="POST" id="form1" action"<%=login%>">
<input id="btn" type="submit" value="Log in" />

其中 %=login% 是调用 java 代码的 jsp 页面。

我注意到，如果我在登录时按住 Enter 按钮或多次按下该按钮，它会不断为用户创建新的会话和请求。在等待服务器响应时，禁用持续按下按钮的最佳方法是什么？

谢谢

标签： javascriptjsp

Answer 1

我会用 AJAX 请求调用 JSP 页面。要防止页面重新加载，请将 EventListener 添加到您的表单中：

document.getElementById("form1").AddEventListener("submit", e => {
    e.preventDefault();
    document.getElementById("btn").disabled = true;
    // AJAX Request
});

如果请求成功或失败，请将按钮的 disabled-attribute 设置为 false。