防止意外双击按钮答案

【问题标题】：Preventing accidental double clicking on a button防止意外双击按钮
【发布时间】：2010-09-08 04:53:00
【问题描述】：

我有一些控件继承自 ASP.NET buttons 并使用 onserverclick。

如果用户单击两次，则该按钮会触发两个服务器端事件。我怎样才能防止这种情况发生？

我尝试在点击后通过 javascript 设置 this.disabled='true'（在 onclick 属性中），但这也阻止了第一次回发。

【问题讨论】：

标签： asp.net javascript button

【解决方案1】：

您也可以尝试例如 btnSave.Enable = false;当点击按钮时，在 Click Event 例程中完成按钮处理之前。如果您需要重置它以允许启用它，请使用一个单独的按钮来重置按钮以供重用。

另一种方法是设置带有验证的按钮，以便询问用户是否要保存，它应该会弹出两次。

另一种方法是标记第一次出现，然后为第二次设置弹出窗口以验证第二次或后续使用。

【讨论】：

【解决方案2】：

将 Button 属性 UseSubmitBehavior 设置为 false。然后创建一个禁用按钮的 OnClientClick 函数。它看起来像这样：

<script type="text/javascript">
   function disableFunctn(button){
       button.disabled = true;
   }
</script>
<asp:Button ID="button1" UseSubmitBehavior="false" OnClientClick="disableFunctn(this);"/>

最快最便宜的方式：

<asp:Button ID="button1" UseSubmitBehavior="false" OnClientClick="this.disabled=true;"/>

【讨论】：

【解决方案3】：

如果是更新面板和 FormView-Template 中的按钮，我使用以下方法：

<script type="text/javascript">
    // Using that prm reference, hook _initializeRequest
    Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(InitializeRequestBuchung);

    // Abfangen von Mehrfachklicks auf Buttons für asynchrone Postbacks im Updatepanel
    function InitializeRequestBuchung(sender, args) {
        var arrButtonIds = ["ButtonInsert", "ButtonUpdate"];

        // Get a reference to the PageRequestManager.
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        if (prm.get_isInAsyncPostBack() & jQuery.inArray(args.get_postBackElement().id, arrButtonIds) > -1) {
            args.set_cancel(true);
        }
    }
</script>

如果当前异步回发仍处于活动状态，这将取消后续回发。完美运行。

【讨论】：

【解决方案4】：

您不一定希望在回发时显示禁用的按钮。您要确保他们不会意外提交两次。因此，由于 服务器端 操作而禁用或隐藏按钮已经为时已晚。至此，第二个请求已经在进行中。您需要使用 javascript 或确保您的服务器端代码不会运行两次。

【讨论】：

【解决方案5】：

我所做的不是隐藏，而是使用 javascript 交换按钮。单击第一个按钮时显示另一个灰色图像。

【讨论】：

【解决方案6】：

请参阅此示例以禁用对回发的控制。它应该可以帮助您完成您想要实现的目标。

http://encosia.com/2007/04/17/disable-a-button-control-during-postback/

【讨论】：

谢谢...我错过了该技术所需的手动回发参考
不幸的是，将 UseSubmitBehavior 更改为 false 意味着您的表单将不再支持没有 JavaScript 的用户。
网站似乎已关闭，Chrome 报告该网站包含恶意软件

【解决方案7】：

几天前有人在这里的某个地方说过这句话，我同意 - 使用 javascript 来简单地隐藏按钮而不是禁用它；您可以在其位置显示“微调器”图像，让用户知道发生了什么。

【讨论】：

我不相信我喜欢按钮消失的想法。除非另一个（禁用按钮）取代了他们的位置。它可能会让最终用户感到困惑......不是吗？
我同意 Rob，我不喜欢按钮消失
+1 表示微调器的想法 - 向用户显示正在发生的事情。如果他绝对坚持，我仍然会给他再次提交的可能性/“控制权”。