aspx

<script type="text/javascript">

    var oldColor;

   function SetNewColor(Source) {

       oldColor = Source.style.backgroudColor;

       Source.style.backgroudColor = "#FFCCFF";

   }

   function SetOldColor(Source) {

       Source.style.backgroudColor = oldColor;

   }

   function ShowPhoto(url) {

       document.getElementById("Image1").src= url;

   }

</script>

<body>

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

    <div>

        <asp:ListView ID="ListView1" runat="server"

            onitemdatabound="ListView1_ItemDataBound">

          <ItemTemplate>

          <table id="myTable" border="" cellpadding=""  cellspacing=""  runat="server"  onmouseover='this.style.backgroundColor="#ff0000"'>

              <tr >

              <td>

                  图片ID:

                  <asp:Label ID="Label1" runat="server" Text=""><%#Eval("id")%></asp:Label>

                  图片名称: <asp:TextBox ID="txtimageName" runat="server" Text='<%#Eval("imageName")%>'></asp:TextBox>

                  图片路径: <asp:TextBox ID="txtimageUrl" runat="server" Text='<%#Eval("imageUrl")%>'></asp:TextBox>

              </td>

          </tr>

          </table>

          </ItemTemplate>

        </asp:ListView>

        <asp:Image ID="Image1" runat="server"  />

        <asp:DataPager ID="DataPager1" PagedControlID="ListView1" runat="server">

        </asp:DataPager>

    </div>

    </form>

</body>

aspx.cs

 ShowImageBll ShowImageBll = new BLL.ShowImageBll();

        protected void Page_Load(object sender, EventArgs e)

        {

            if (!IsPostBack)

            {

                bindDL();

            }

        }

        public void bindDL()

        {

            //绑定数据源

            DataSet ds = ShowImageBll.GetList();

            ListView1.DataSource = ds;

            ListView1.DataBind();

        }

        protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e)

        {

            if (e.Item.ItemType == ListViewItemType.DataItem) //判断目前的项目是否为一个数据项目

            {

                ListViewDataItem curDataItem = (ListViewDataItem)e.Item; //把目前的项目转化为一个ListViewDataItem

                DataRowView curRow = (DataRowView)curDataItem.DataItem;//把获取的行转化为DataRowView对象

                int id = int.Parse(curRow["id"].ToString());

                String imageUrl = ShowImageBll.getImageUrlByID(id);

                HtmlTable myTable = (HtmlTable)curDataItem.FindControl("myTable");//获取ItemTemplate模板中的Table控件

                myTable.Attributes.Add("onMouseOver", "SetNewColor(this);ShowPhoto('"+imageUrl+"');");

               myTable.Attributes.Add("onMouseOut", "SetOldColor(this);ShowPhoto('image/20131129.jpg');");

            }

        }

总结：
【1】前段HTML的Table控件 定义： <table id="myTable" border="1" cellpadding="5"  cellspacing="0"  runat="server">

  后端获取时：HtmlTable myTable = (HtmlTable)curDataItem.FindControl("myTable");//获取ItemTemplate模板中的Table控件

（此时需要添加引用using System.Web.UI.HtmlControls;）

【2】ListViewDataItem curDataItem = (ListViewDataItem)e.Item; //把目前的项目转化为一个ListViewDataItem
      DataRowView curRow = (DataRowView)curDataItem.DataItem;//把获取的ListViewItem对象所绑定的数据转化为DataRowView对象               
【3】遗留的问题：背景颜色的切换不起作用。函数SetNewColor(this)或者设置在aspx页面内嵌javascript也不起作用

《ASP.NET1200例》高亮显示ListView中的数据行并自动切换图片的更多相关文章

  1. 《ASP.NET1200例》ListView 控件与DataPager控件的结合<一>

    分页     在前一部分开始时介绍的原 HTML 设计中内含分页和排序,所以根据规范完整实现该网格的任务尚未完成.我们先分页,然后再排序. ListView 控件中的分页通过引入另一个新控件 Data ...

  2. 《ASP.NET1200例》ListView控件之修改，删除与添加

    aspx <body> <form id="form1" runat="server"> <div> <asp:Lis ...

  3. 《ASP.NET1200例》ListView 控件与DataPager控件的结合<二>

    ASP.NET使用ListView数据绑定控件和DataPager实现数据分页显示 为什么使用ListView+DataPager的方式实现分页显示? .net提供的诸多数据绑定控件,每一种都有它自己 ...

  4. C#中清空ListView中的数据

    我的显示数据的方式通过button按钮点击事件,当点击之后查询数据库库并将数据显示出来. 代码如下: private void button6_Click(object sender, EventAr ...

  5. c#导出ListView中的数据到Excel表格

    1.添加组件:Microsoft.Office.Interop.Excel 步骤:右键点击“引用”--->添加引用--->COM--->Microsoft.Office.Intero ...

  6. 触发器修改后保存之前的数据 表中插入数据时ID自动增长

    create or replace trigger t before update on test5 for each rowbegin insert into test55 values (:old ...

  7. 第18课-数据库开发及ado.net 连接数据库.增.删.改向表中插入数据并且返回自动编号.SQLDataReade读取数据

    第18课-数据库开发及ado.net 连接数据库.增.删.改向表中插入数据并且返回自动编号.SQLDataReade读取数据 ADO.NET 为什么要学习? 我们要搭建一个平台(Web/Winform ...

  8. 【转载】C#中遍历DataTable中的数据行

    在C#中的Datatable数据变量的操作过程中,有时候我们需要遍历DataTable变量获取每一行的数据值,例如将DataTable变量转换为List集合的时候,我们就会遍历DataTable变量, ...

  9. Android中仿淘宝首页顶部滚动自定义HorizontalScrollView定时水平自动切换图片

    Android中仿淘宝首页顶部滚动自定义HorizontalScrollView定时水平自动切换图片 自定义ADPager 自定义水平滚动的ScrollView效仿ViewPager 当遇到要在Vie ...

随机推荐

  1. (Struts)ActionForm类及表单数据验证

    LoginForm代码: /* * Generated by MyEclipse Struts * Template path: templates/java/JavaClass.vtl */ pac ...

  2. win8 配 jdk

    Win8配置jdk 1.7环境变量  环境:win8(32位)64位差不多       jdk1.7    1.右击计算机-属性-高级系统设置-高级-环境变量,弹出“环境变量”对话框,主要是改下面的环 ...

  3. 小菜鸟学Spring-读取属性文件值（三）

    Example: the PropertyPlaceholderConfigurer 属性配置文件内容如下所示: jdbc.driverClassName=org.hsqldb.jdbcDriver ...

  4. 教你一步一步实现一个Promise

    Promise我想现在大家都非常熟悉了,主要作用就是解决异步回调问题,这里简单介绍下. Promise规范是CommonJS规范之一,而Promise规范又分了好多种,比如 Promises/A.Pr ...

  5. Jquery-处理iframe的高度自适应

    超级简单的方法,也不用写什么判断浏览器高度.宽度啥的.下面的两种方法自选其一就行了.一个是放在和iframe同页面的,一个是放在test.html页面的.注意别放错地方了哦. iframe代码,注意要 ...

  6. 【CodeForces 297C】Splitting the Uniqueness

    题意 序列s有n个数,每个数都是不同的,把它每个数分成两个数,组成两个序列a和b,使ab序列各自去掉个数后各自的其它数字都不同. 如果存在一个划分,就输出YES,并且输出两个序列,否则输出NO. 分析 ...

  7. HackerRank Ice Cream Parlor

    传送门 Ice Cream Parlor Authored by dheeraj on Mar 21 2013 Problem Statement Sunny and Johnny together ...

  8. Tarjan算法详解理解集合

    [功能] Tarjan算法的用途之一是,求一个有向图G=(V,E)里极大强连通分量.强连通分量是指有向图G里顶点间能互相到达的子图.而如果一个强连通分量已经没有被其它强通分量完全包含的话,那么这个强连 ...

  9. Spring学习8-用MyEclipse搭建SSH框架 Struts Spring Hibernate

    1.new一个web project. 2.右键项目,为项目添加Struts支持. 点击Finish.src目录下多了struts.xml配置文件. 3.使用MyEclipse DataBase Ex ...

  10. css3 正方体旋转

    <div class="contain"> <div class="box"> <div class="face one ...