WebForm 控件（二）

时间：2022-01-03 16:33:53

控件

Calendar：日历控件 但是html代码量太大不适用

FileUpdate： 文件上传

HiddenField：隐藏域

Image： 图片  可以直接给URL 不适用可用html代码写

Table：表格  不适用

AdRotator组件通常又称广告轮显组件，其功能相当于在网站上建立了一个，符合广告领域标准功能的广告系统。

验证类登录类自带控件不要用

【Repeater】：

HeaderTemplate - 在加载开始执行一遍

ItemTemplate - 有多少条数据，执行多少遍

FooterTemplate - 在加载最后执行一遍

AlternatingItemTemplate - 交替项模板

<%#Eval("需要的字段")%>  ：动态网页提供动态数据的符号

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="lianxi.aspx.cs" Inherits="lianxi" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

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

            <HeaderTemplate>

                <table style="background-color:navy;text-align:center">

                    <tr style="color:white;padding:10px;">

                        <td>UserName</td>

                        <td>PsssWord</td>

                        <td>NickName</td>

                        <td>Sex</td>

                        <td>Birthday</td>

                        <td>Nation</td>

                    </tr>

             </HeaderTemplate>

            <ItemTemplate>

                <tr style="background-color:yellow">

                    <td><%#Eval("UserName")%></td>

                    <td><%#Eval("PassWord")%></td>

                     <td><%#Eval("NickName")%></td>

                    <td><%#Eval("Sex")%></td>

                     <td><%#Eval("birthday")%></td>

                    <td><%#Eval("Nation")%></td>

                </tr>

            </ItemTemplate>

            <FooterTemplate>

              </table>

            </FooterTemplate>

        </asp:Repeater>

    </form>

</body>

</html>

光棒效果：

    <script type="text/javascript">

         window.onload = function () {

             var items = document.getElementsByClassName("tr_Item");

             var oldColor = "";

            for (var i = ; i < items.length; i++) {

                 items[i].onmouseover = function () {

                     oldColor = this.style.backgroundColor;

                     this.style.backgroundColor = "yellow";

                 };

                 items[i].onmouseout = function () {

                     this.style.backgroundColor = oldColor;

                 };

             }

         };

     </script>

相关文章