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

Question

我有一個提交按鈕。 單擊此按鈕后，表單將被提交。 我想防止用戶多次單擊它。 因此，OnClientClick

我正在使用這樣的功能禁用按鈕，

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

但是現在的問題是我的表格沒有提交。

即使當我從JavaScript函數返回true時。 以下是我的javascript函數

 function ab() {

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

        return true;
    }

我也在使用母版頁。

Answer 1

我認為問題在於它必須綁定到表單的提交。 以下代碼將解決此問題。

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

Answer 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;
 }

Answer 3

對於我希望真的很常見的東西來說，這是令人驚訝的晦澀。 如果在單擊按鈕后禁用該按鈕，則將防止發生回發。 甚至@Rajdeep在表單的Submit事件中禁用它的建議對我也不起作用。

我發現最好的方法是設置按鈕的UseSubmitBehavior =“ false”：

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

這將導致服務器修改按鈕的OnClick事件，以包括啟動回發的javascript調用，因此在瀏覽器中如下所示：

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

即使btn123最終被禁用，這也會導致在調用函數ab（）之后發生回發。