如何从C#后台代码获取用户控件修改后的类名

你遇到的问题核心在于客户端DOM的class修改不会自动同步回服务器端控件的属性：

• 标准Web控件（比如原生TextBox）之所以让你觉得能获取到新增类名，大概率是误解——默认情况下，ASP.NET不会把客户端修改的DOM class值同步回服务器端的CssClass属性，除非控件做了特殊的回发数据处理。
• 你的自定义UserControl的CssClass属性只是简单关联内部TextBox的CssClass，但前端通过jQuery修改的是客户端DOM的class，这个变化只存在于浏览器中，不会主动回传到服务器，所以后台只能拿到初始化时的默认类名。

要解决这个问题，核心是把客户端修改后的class值通过某种方式提交到服务器，再同步到自定义控件的属性里。这里提供两种实用方案：

方案1：用隐藏域同步客户端class值 #

这是最简单直接的方式，通过隐藏域存储客户端修改后的class，回发时让服务器读取这个值：

1. 自定义UserControl前端（.ascx） #

添加一个隐藏域，和内部TextBox放在一起：

<asp:TextBox ID="txtInner" CssClass="defaultClass" runat="server"></asp:TextBox>
<asp:HiddenField ID="hfCssClass" runat="server" />

2. 自定义UserControl后台（.ascx.cs） #

修改CssClass属性，优先读取隐藏域的值：

public string CssClass
{
    get
    {
        // 回发时优先取隐藏域的最新值，否则用TextBox的默认值
        return string.IsNullOrEmpty(hfCssClass.Value) ? txtInner.CssClass : hfCssClass.Value;
    }
    set
    {
        txtInner.CssClass = value;
        hfCssClass.Value = value;
    }
}

3. 前端jQuery代码 #

修改class的同时，把最新的class值同步到隐藏域：

// 假设你的自定义控件客户端ID是"uc_MyControl"
const $targetTextBox = $("#uc_MyControl_txtInner");
$targetTextBox.addClass("newClass");
// 更新隐藏域的值
$("#uc_MyControl_hfCssClass").val($targetTextBox.attr("class"));

方案2：实现IPostBackDataHandler接口处理回发 #

如果希望控件更“原生”，可以让自定义UserControl实现IPostBackDataHandler接口，主动处理回发数据：

1. 自定义UserControl后台代码 #

public partial class MyCustomControl : UserControl, IPostBackDataHandler
{
    public string CssClass
    {
        get => txtInner.CssClass;
        set => txtInner.CssClass = value;
    }

    // 处理回发数据
    public bool LoadPostData(string postDataKey, NameValueCollection postCollection)
    {
        // 获取前端提交的最新class值
        var submittedClass = postCollection[$"ucCss_{this.ID}"];
        if (!string.IsNullOrEmpty(submittedClass) && submittedClass != CssClass)
        {
            CssClass = submittedClass;
            return true; // 表示属性值有变化，触发后续事件
        }
        return false;
    }

    // 属性变化时触发的事件（可选）
    public void RaisePostDataChangedEvent()
    {
        // 这里可以自定义事件，比如OnCssClassChanged
    }

    // 渲染时输出用于提交class的隐藏字段
    protected override void Render(HtmlTextWriter writer)
    {
        writer.Write($"<input type='hidden' name='ucCss_{this.ID}' id='ucCss_{this.ID}' value='{CssClass}' />");
        base.Render(writer);
    }
}

2. 前端jQuery代码 #

修改class后同步到隐藏字段：

const ucId = "uc_MyControl";
const $txt = $("#" + ucId + "_txtInner");
$txt.addClass("newClass");
$("#ucCss_" + ucId).val($txt.attr("class"));

以后别再混淆服务器端控件属性和客户端DOM属性了：服务器端属性负责渲染初始的DOM状态，但客户端修改DOM后，除非主动把变化提交回服务器，否则服务器端是感知不到的——标准Web控件也不例外，你之前的测试可能是误判啦。

内容的提问来源于stack exchange，提问作者Sepcio