天天看点

onmouseover和onmouseout在Repeater控件中应用

它是在GridView控件中演示,但是它的方法在Repeater控件是无法复制的。

由于看到论坛上有网友问及,花上一点点时间做了Repeater控件的演示。首先看看效果(动画结束,尝试刷新网页):

onmouseover和onmouseout在Repeater控件中应用

为了能在Repeater控件上实现onmouseover和onmouseout样式,Insus.NET想只要控到表的行即可,在Repeater控件的OnItemCreated事件中去实现,需要分别写好ItemTemplate模版与AlternatingItemTemplate模版,另外还注意的地方,就是把tr转为web控件,这样好在cs好找到。

.aspx(部分):

onmouseover和onmouseout在Repeater控件中应用
onmouseover和onmouseout在Repeater控件中应用

View Code

 <asp:Repeater ID="Repeater1" runat="server" OnItemCreated="Repeater1_ItemCreated">

            <HeaderTemplate>

                <table border="1" cellpadding="3" cellspacing="0">

                    <tr>

                        <td>

                            MediaTypeId

                        </td>

                            TypeName

                            Description

                            IsActive

                            CreateDate

                    </tr>

            </HeaderTemplate>            

            <ItemTemplate>

                <tr id="itl" runat="server">

                    <td>

                        <%# Eval("MediaTypeId") %>

                    </td>

                        <%# Eval("TypeName")%>

                        <%# Eval("Description")%>

                        <%# Eval("IsActive")%>

                        <%# Eval("CreateDate")%>

                </tr>

            </ItemTemplate>

            <AlternatingItemTemplate>

                <tr id="att" runat="server">

            </AlternatingItemTemplate>

            <FooterTemplate>

                </table>

            </FooterTemplate>

        </asp:Repeater>

.aspx.cs(部分),有一点需要留意的是,首先获取行的BackColor,这样好的Mouse out时,回复原来的Color:

onmouseover和onmouseout在Repeater控件中应用
onmouseover和onmouseout在Repeater控件中应用

 protected void Repeater1_ItemCreated(object sender, RepeaterItemEventArgs e)

    {

        if (e.Item.ItemType == ListItemType.Item)

        {

            if (e.Item.FindControl("itl") != null)

            {

                HtmlTableRow htr_itl = (HtmlTableRow)e.Item.FindControl("itl");

                ApplyStyle(htr_itl, htr_itl.BgColor);

            }

        }

        if (e.Item.ItemType == ListItemType.AlternatingItem)

            if (e.Item.FindControl("att") != null)

                HtmlTableRow htr_att = (HtmlTableRow)e.Item.FindControl("att");

                ApplyStyle(htr_att, htr_att.BgColor);

    }

    private void ApplyStyle(HtmlTableRow htr, string trBackColor)

        string onmouseoverStyle = "this.style.backgroundColor='Peachpuff'";

        string onmouseoutStyle = "this.style.backgroundColor='@BackColor'";

        htr.Attributes.Add("onmouseover", onmouseoverStyle);

        htr.Attributes.Add("onmouseout", onmouseoutStyle.Replace("@BackColor", trBackColor));

继续阅读