如何在第一次提交（在客户端）后立即禁用 ASP.NET 按钮？

Posted 2023-05-08

【中文标题】如何在第一次提交（在客户端）后立即禁用 ASP.NET 按钮？

【英文标题】：How to disable an ASP.NET Button right after first submit (on the client)?

【发布时间】：2015-03-06 04:19:44

【问题描述】：

我有一个提交按钮。单击此按钮后，表单将被提交。我想防止用户多次点击它。所以 OnClientClick

我正在使用这样的禁用按钮的功能，

$("#btn123").attr("disabled", "disabled");

但现在的问题是我的表单没有被提交。

即使我从我的 javascript 函数返回 true。以下是我的javascript函数

 function ab() 

        $("#btn123").attr("disabled", "disabled");

        return true;
    

我也在使用母版页。

【问题讨论】：

如果你想提交表单，那么你可以在服务器端使用 .Visible = false; 禁用它

在服务器端禁用只会在调用完成时反映，所以不会起作用@Adil

参考这个***.com/questions/22803461/…

您正在禁用按钮单击处理程序中的按钮。为什么不禁用表单提交处理程序中的按钮？这将确保表单被提交。

在提交按钮上单击一次时，您已将禁用属性添加到具有 id btn123 的提交按钮。如果您仔细检查 DOM 结构中的元素，您会发现在提交标记中添加了 disabled="disabled"。因此，只需在您提交的内容完成后做一件事，调用另一个函数并在其中添加$("#btn123").attr("disabled", "false");。

【参考方案1】：

我认为问题在于它需要绑定到表单的提交。下面的代码将解决这个问题。

$("#formId").submit(function()
    $("#btn123").attr("disabled", "disabled");
)

【讨论】：

这听起来是个不错的计划，但它对我不起作用——如果按钮在表单的 submit() 事件中被禁用，回发仍然会被阻止。这可能取决于浏览器/版本。

【参考方案2】：

按钮未触发 postBack，因为您已禁用此功能。避免多个 postBack 的方法是并排放置两个按钮。真实的和虚拟的。第一次点击隐藏/删除真实按钮并显示虚拟按钮

<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" ClientIDMode="Static" OnClientClick="disableButton();"/>

<asp:Button ID="ButtonDummy" runat="server" Text="Button" ClientIDMode="Static" OnClientClick='return false;' style="display:none;"/>

和 JS：

function disableButton() 

 $("#Button1").hide();

 $("#ButtonDummy").show();

 return true;
 

【参考方案3】：

对于我认为很常见的事情来说，这令人惊讶地晦涩难懂。如果在单击按钮后禁用该按钮，它将阻止回发。即使@Rajdeep 建议在表单的提交事件中禁用它也对我不起作用。

我发现最好的方法是设置按钮的 UseSubmitBehavior="false":

<asp:Button ID="btn123" UseSubmitBehavior="false" OnClientClick="ab()"
    OnClick="btn123_Click" runat="server" />

这将导致服务器修改按钮的 OnClick 事件以包含一个用于启动回发的 javascript 调用，因此它在浏览器中如下所示：

OnClientClick="ab();__doPostBack('ctl00$btn123','')"

这将导致在调用函数 ab() 后发生回发，即使 btn123 最终被禁用。