在 asp 中突出显示（粗体）行：Repeater with timer

Question

我有一个用中继器显示的活动列表。我已经使用定时器来显示这些，所以定时器不是问题。这是我必须放入Timer_tick 方法的代码。

“highlight-Timer”应该一次突出显示项目/行，然后我想显示一些与突出显示的行相关的信息。

如果使用另一个控件更容易，那也没问题。我不必成为中继器。我只是因为样式可能性而使用它（它不仅仅显示在一行中，而是有几个换行符等）

根据要求：

（中继器）

<asp:Repeater ID="Repeater1" runat="server">
    <ItemTemplate>
        <div id="divActivity" runat="server">
            <span style="font-size:30px;">
                <%# DataBinder.Eval(Container.DataItem, "act_headline") %>
            </span>
            <br />
            <img alt="mapIcon" src="../img/mapIcon.gif" height="15px" width="15px" style="position:absolute;" />
            <span style="font-size:12px; font-style:italic; margin-left:23px;">    
                <%# DataBinder.Eval(Container.DataItem, "act_place") %>
            </span>
            <img alt="watchIcon" src="../img/watchIcon.png" height="15px" width="15px" style="position:absolute;" /> 
            <span style="font-size:12px; font-style:italic; margin-left:23px;">
                <%# DataBinder.Eval(Container.DataItem, "act_start") %> - <%# DataBinder.Eval(Container.DataItem, "act_end") %>
            </span>
            <br />
            <div style="word-wrap: break-word; width:1000px; margin-top:20px; padding:0;">
                <%# DataBinder.Eval(Container.DataItem, "act_text") %>
            </div>
            <br />
                <img alt="infoIcon" src="../img/infoIcon.png" height="15px" width="15px" style="position:absolute;" />
            <span style="font-size:12px; margin-left:23px;"><a target="_blank" href="http://<%# DataBinder.Eval(Container.DataItem, "act_info") %>"><%# DataBinder.Eval(Container.DataItem, "act_info") %></a>
            </span>
        </div>
    </ItemTemplate>
</asp:Repeater>

我在 Timer_tick 事件中没有任何内容，因为我尝试了几件事并在失败后将其删除。希望够了。

Answer 1

我会通过循环Repeater.Items 集合在滴答事件处理程序中使用类似这样的东西来为突出显示的项目设置一个特殊的 CSS 类。

类似这样的东西（未经测试）：

int currentHighlight = -1;
int nextHighlight = -1;
for (int i = 0; i < Repeater1.Items.Count; i++)
{
    HtmlControl htmlDiv = (HtmlControl)Repeater1.Controls[i].Controls[1];

    if (htmlDiv.Attributes["class"] != null)
    {
        if (htmlDiv.Attributes["class"].Contains("highlighted")) // this is the currently highlighted item
        {
            // record currently highlighted item index
            currentHighlight = i;

            // remove highlight
            htmlDiv.Attributes["class"].Replace("highlighted", "");
            htmlDiv.Attributes["class"].Trim();
        }
    }
}

if ((currentHighlight == -1) || (currentHighlight == Repeater1.Items.Count))
{
    // handle first Item highlighting
    nextHighlight = 1;
}
else
{
    // handle standard case
    nextHighlight = currentHighlight + 1;
}

// highlight next item
((HtmlControl)Repeater1.Controls[nextHighlight].Controls[1]).Attributes["class"] += " highlighted";

然后您可以使用highlighted CSS 类来处理样式（您提到的粗体字体）以及 JavaScript 或 jQuery 中的一些特殊行为。

顺便说一句，您可以在RepeaterItem 对象上执行任何其他操作，一旦您得到当前突出显示的对象。