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. oracle-5-的升级步骤

    升级数据库的步骤 1.决定升级到那个版本 2.确定最近的数据已经备份(非常的重要) 3.安装软件升级包 4.升级方式启动数据库 5.执行必要的脚本 6.升级后的检查

  2. 在Web Service中傳送Dictionary

    有個需求,想在Web Service中傳遞Dictionary<string, string>參數,例如: 排版顯示純文字 [WebMethod] public Dictionary< ...

  3. Java基础-数据类型转换

     1).简单类型数据间的转换,有两种方式:自动转换和强制转换,通常发生在表达式中或方法的参数传递时.  自动转换 当一个较"小"数据与一个较"大"的数据一起运算 ...

  4. BZOJ-2190 仪仗队 数论+欧拉函数（线性筛）

    今天zky学长讲数论,上午水,舒爽的不行..后来下午直接while(true){懵逼:}死循全程懵逼....(可怕)Thinking Bear. 2190: [SDOI2008]仪仗队 Time Li ...

  5. Vijos1901 学姐的钱包

    描述 学姐每次出门逛街都要带恰好M元钱, 不过她今天却忘记带钱包了.可怜的doc只好自己凑钱给学姐, 但是他口袋里只有一元钱.好在doc的N位朋友们都特别有钱, 他们答应与doc作一些交换.其中第i位 ...

  6. SSL、TLS协议格式、HTTPS通信过程、RDP SSL通信过程

    相关学习资料 http://www.360doc.com/content/10/0602/08/1466362_30787868.shtml http://www.gxu.edu.cn/college ...

  7. POJ2299Ultra-QuickSort(归并排序 + 树状数组求逆序对)

    树状数组求逆序对   转载http://www.cnblogs.com/shenshuyang/archive/2012/07/14/2591859.html 转载: 树状数组,具体的说是 离散化+树 ...

  8. 过滤器在Web开发应用------解决中文乱码

    src/com/Encoding.java package com; import java.io.IOException; import javax.servlet.Filter; import j ...

  9. WGS84、Web墨卡托、火星坐标、百度坐标互转

    转自:1.http://blog.csdn.net/wildboy2001/article/details/12031351 2.http://kongxz.com/2013/10/wgs-cgj/ ...

  10. iOS exit(0); 直接退出程序

    exit();