无需FindControl获取Repeater内Div并修改其背景色的实现方案

针对你遇到的这个问题——Repeater里的div用了动态绑定的ID（关联记录用，不能改），后台没法直接用FindControl定位，我整理了几个实用的方案，你可以根据业务场景挑选：

方案1：绑定阶段直接通过Eval或后台方法设置样式 #

这是最直接的方式，你之前尝试的style绑定思路是对的，可能是细节没处理到位：

• 如果数据源本身带有背景色字段，直接绑定即可：

  <div id="<%# Eval("id") %>" style='background-color: <%# Eval("BgColor") %>;'>
      <!-- 记录内容 -->
  </div>
  

• 如果需要根据业务逻辑动态计算颜色，写个后台方法返回对应值：
  后台C#代码：

  protected string GetRecordBgColor(object recordId)
  {
      // 根据recordId做自定义逻辑判断，比如区分已读/未读记录
      int id = Convert.ToInt32(recordId);
      return id % 2 == 0 ? "#f0f8ff" : "#ffffff"; // 偶数ID用淡蓝，奇数用白色
  }
  

  前台绑定：

  <div id="<%# Eval("id") %>" style='background-color: <%# GetRecordBgColor(Eval("id")) %>;'>
      <!-- 记录内容 -->
  </div>
  

方案2：利用Repeater的ItemDataBound事件（服务器端处理） #

这个方案需要给div加上runat="server"（完全不影响你的动态ID关联，因为ID还是绑定的原始记录值），然后在服务器端事件里定位当前项的div：

1. 修改前台div标签：

   <div id="<%# Eval("id") %>" runat="server">
       <!-- 记录内容 -->
   </div>
   

2. 后台编写ItemDataBound事件逻辑：

   protected void YourRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
   {
       // 只处理数据项，跳过表头、脚注等非数据行
       if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
       {
           // 获取当前绑定的记录实体（替换成你的实际数据类型）
           var targetRecord = e.Item.DataItem as YourRecordModel;
           if (targetRecord != null)
           {
               // 遍历当前项控件，找到目标div
               foreach (Control ctrl in e.Item.Controls)
               {
                   if (ctrl is HtmlGenericControl targetDiv && targetDiv.ID == targetRecord.id.ToString())
                   {
                       // 根据业务规则设置背景色，比如标记待处理记录
                       targetDiv.Style["background-color"] = "#ffebee";
                       break;
                   }
               }
           }
       }
   }
   

方案3：前端JavaScript动态设置（适合客户端交互场景） #

如果需要在页面加载后或用户操作时修改背景色，可以用这种方式：

1. 后台把需要高亮的记录ID列表传到前端，比如存在隐藏域中：

   <input type="hidden" id="highlightIds" value="<%= GetHighlightIds() %>" />
   

   后台方法生成ID字符串：

   protected string GetHighlightIds()
   {
       // 模拟获取需要高亮的ID列表，实际可从数据库/会话中读取
       List<int> ids = new List<int> { 1, 3, 5 };
       return string.Join(",", ids);
   }
   

2. 前端用JavaScript（以jQuery为例）定位div并设置样式：

   $(document).ready(function() {
       var highlightIds = $('#highlightIds').val().split(',');
       highlightIds.forEach(function(id) {
           if (id) { // 避免空值报错
               $('#' + id).css('background-color', '#fff3e0');
           }
       });
   });
   

方案4：统一CSS类+数据属性（灵活前端控制） #

给所有Repeater里的div加一个统一类名，再绑定data-id属性（和ID保持一致），方便前端精准筛选：

<div id="<%# Eval("id") %>" class="record-item" data-id="<%# Eval("id") %>">
    <!-- 记录内容 -->
</div>

前端可通过data属性快速定位：

// 筛选ID为2的记录div并设置背景色
$('.record-item[data-id="2"]').css('background-color', '#e8f5e9');

这些方案各有侧重：方案1、2适合服务器端直接渲染的场景，方案3、4适合需要客户端动态调整的需求，你可以根据自己的业务逻辑选择~

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