javascript - 当第一次单击后应关闭表单时，用户可以多次单击按钮

Question

在主页上，有一个按钮会弹出一个对话框，提示用户输入用户名和密码。当他们单击“保存”时，凭据将被验证(JS 和 SQL)，并且窗口要么关闭，要么告诉他们凭据无效。

不过，我遇到了一些奇怪的行为，我可以无限地按下按钮，然后多次执行“保存”操作。

在 Page_Load 上，我们将 Javascript“事件”附加到按钮，如下所示:

btnSave.Attributes.Add("onClick", "return ValidateUserPasswordSignPopup('" & txtUsername.ClientID & "', '" & txtPassword.ClientID & "');")

<小时/>

Javascript 验证:

function ValidateUserPasswordSignPopup(userTxtBox, PassTxtBox)
{
    var userTextBoxctrl = document.getElementById(userTxtBox)
    var PassTxtBoxctrl = document.getElementById(PassTxtBox)

    if (userTextBoxctrl.value.trim() == '') {
        alert("Please enter User Name.")
        document.getElementById(userTxtBox).focus();
        return false;
    }

    if (PassTxtBoxctrl.value.trim() == '')
    {
        alert("Please enter Password.")
        document.getElementById(PassTxtBox).focus();
        return false;
    }

    return true;
}

<小时/>

点击按钮:

Protected Sub btnSave_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnSave.Click

    If SaveData() Then
        Response.Write("<script language = JavaScript>window.returnValue='yes';self.close();</script>")
    End If

End Sub

<小时/>

SaveData() 只是创建一些对象，运行一个存储过程，再创建一些对象，然后创建一个 DataTable，将其传递给另一个方法并保存到数据库。没有什么太强烈的。

我尝试在 JS 方法中添加代码来禁用该按钮，然后在代码端单击事件结束时重新启用它，但窗口似乎会无限挂起。

我还尝试在 JS 之间切换其状态(在每次 return/最后重新启用它)，然后在单击事件开始时重新禁用它并重新-在点击事件结束时再次启用它，但我仍然可以通过此路线多次点击该按钮。

有人知道这可能是什么原因造成的吗？

编辑我最初的想法是Javascript运行所需的时间，尽管脚本很简短，但允许用户在回发处理之前重新单击按钮点击事件。我完全删除了上面第一段代码中添加到 Page_Load 中的脚本，但该行为仍然发生。

Answer 1

由于向服务器提交表单和来自服务器的响应内容之间存在延迟，用户可以多次单击该按钮。

在ValidateUserPasswordSignPopup中的return true;之前禁用或隐藏按钮。

另一种方式:

var submittedFlag = false;
function ValidateUserPasswordSignPopup(userTxtBox, PassTxtBox)
{
  if (submittedFlag)
    return false;

  ...

  submittedFlag = true;
  return true;
}