c# - 在 asp :Repeater with timer 中突出显示(粗体)行

Question

我有一个使用 Repeater 显示的事件列表。我已经使用定时器来显示这些，所以定时器不是问题。这是我必须放入 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 集合上循环，在 tick 事件处理程序中使用类似这样的东西，为突出显示的项目设置一个特殊的 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 对象上执行任何其他操作，一旦您得到当前突出显示的对象。