如何避免双击.N​​ET中的提交按钮

Question

我的c＃web应用程序有2个面板。第一个面板是输入一些文字。 第二个面板仅在第一个面板通过验证后显示，并单击继续按钮。 第二个面板有一个带有4个验证的文本框，一个下拉列表框和一个提交按钮。 如果验证是好的并且用户点击他提交按钮，我希望禁用提交按钮并将其文本更改为“请稍候...”以防止用户双击它。 我是.NET的新手，所以非常感谢任何帮助。

protected void BTNSubmit_Click(object sender, EventArgs e)
{
if (Page.IsValid)
{
BTNSubmit.Text = "Please wait...";
BTNSubmit.Enabled = false;

DoSomething();
}
}

Answer 1

这是你需要使用javascript和asp.net的onclientclick属性（转换为javascript的onclick）来捕获前端的东西。）

一个重要的关键是，如果您的onclientclick返回false，您的服务器事件将不会触发（这是您想要的第二次点击）

var submitted=false; //javascript variable to store if we have clicked submit yet

function ClientSubmit(obj){ //obj is your button
    if(submitted) {return false;} //return false prevents server onclick from firing
    submitted=true;
    obj.value='Please Wait...';
    obj.disabled = true;
    return true;  
}

现在下次点击时，您的javascript会看到submitted设置为true，因此此函数将返回false，并阻止服务器事件触发

要在.aspx页面上实现此功能

<asp:Button id="myButton" runat="server" 
 onclick="BTNSubmit_Click" onclientclick="return ClientSubmit(this);"  Text="Submit"/>