如何防止Javascript禁用按钮在回发后重新启用

How to prevent a Javascript disabled button from re-enabling after postback?

本文关键字:新启用 启用 Javascript 何防止 按钮      更新时间:2023-09-26

下面的代码示例演示了这个问题。当单击Button1时,通过JavaScript禁用Button3。单击Button2将导致启动回发的服务器事件。回发后,Button3不再被禁用。

ASPX

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestDisableButton.aspx.cs" Inherits="StudentForms_CaseManagement_TestDisableButton" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script language="javascript" type="text/javascript">
        function Button1_onclick() {
            document.getElementById("<%= Button3.ClientID %>").disabled = true;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="Button1" type="button" value="Disable Button 3" onclick="return Button1_onclick()" />
        <asp:Button ID="Button2" runat="server" Text="Perform Post Back" onclick="Button2_Click" />
        <asp:Button ID="Button3" runat="server" Text="Button3" />
        <br />
        <asp:Label ID="Label1" runat="server" ></asp:Label>
    </div>
    </form>
</body>
</html>
后台代码>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class StudentForms_CaseManagement_TestDisableButton : System.Web.UI.Page
{
    protected void Button2_Click(object sender, EventArgs e)
    {
        Label1.Text = "Button 2 clicked";
    }
}

按钮在服务器端重新创建,基于它的最新状态(存储在ViewState中,从服务器到浏览器再返回到服务器)和发布的值。

问题是禁用状态在ViewState中,您无法在客户端修改它。唯一发布的值是控件本身的值(例如文本框中的文本)。

所以,因为你不能修改ViewState,唯一的选择是有一个额外的控件在您的表单,允许发布禁用状态回服务器。因此,您需要添加HiddenField,在客户端设置其状态(在启用/禁用按钮的同一脚本中),然后在服务器端恢复发布回来的值并将其应用于控件。即读取隐藏字段值,并相应设置按钮的Enabled属性

在回发时禁用Button3

protected void Button2_Click(object sender, EventArgs e)
{
    Button3.Enabled = false;
}