GridView实现toolTip功能

 

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

<! DOCTYPE html PUBLIC  " -//W3C//DTD XHTML 1.0 Transitional//EN "   " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >

< html xmlns = " http://www.w3.org/1999/xhtml "   >
< head runat = " server " >
     < title > 无标题页 </ title >
     < script language = " javascript "  type = " text/javascript " >
        function selectkk()
         {
         var item = document.getElementById('Select1');
         // window.alert("sddsdsd");
          if(item.selectedIndex!=0)
          {
            window.alert(item.options[item.selectedIndex].text);
          }
          else
          {
             window.alert("is 0");
          }
          
        }
        
        function showDetail(cell1,cell2)
         {
           document.getElementById('td1').innerText="Name:"+cell1;
           document.getElementById('td2').innerText="Address:"+cell2;
           //获得鼠标的X轴的坐标
            x = event.clientX + document.body.scrollLeft;
             
           //获得鼠标的Y轴的坐标
          y = event.clientY + document.body.scrollTop+10;
           
            //显示弹出窗体
           Popup.style.display="block";
          
           //设置窗体的X,Y轴的坐标
           Popup.style.left = x;
           Popup.style.top = y;
        }
          // 隐藏弹出窗体
        function hide()
       {
             //隐藏窗体
           Popup.style.display="none";
         }

     </ script >
        < style type = " text/css " >
     .transparent 
      { BORDER-RIGHT: indianred 1px solid; 
     BORDER-TOP: indianred 1px solid;
      DISPLAY: none; FILTER: alpha(opacity=85);
       BORDER-LEFT: indianred 1px solid; 
       BORDER-BOTTOM: indianred 1px solid; 
       POSITION: absolute; 
       BACKGROUND-COLOR: infobackground; 
       font-color;red;}
        </ style >

</ head >
< body >
     < form id = " form1 "  runat = " server " >
     < div >
         < table border = " 1 "  style = " width: 50% " >
             < caption >
             </ caption >
             < tr >
                 < td style = " width: 100px " >
                 </ td >
                 < td style = " width: 100px " >
                     < select id = " Select1 "  style = " width: 109px "  name = " slt " >
                         < option value = " 0 " ><-- seleted --></ option >
                         < option value = " 1 " > zhanpeng </ option >
                         < option value = " 2 " > zhanjia </ option >
                         < option value = " 3 " > lee jing </ option >
                        
                     </ select >
                 </ td >
                 < td style = " width: 122px " >
                     < input id = " Button1 "  type = " button "  value = " button "  onclick = " selectkk(); "  runat = " server "   /></ td >
             </ tr >
             < tr >
                 < td style = " width: 100px " >
                 </ td >
                 < td style = " width: 100px " >
                 </ td >
                 < td style = " width: 122px " >
                 </ td >
             </ tr >
             < tr >
               
                 < td style = " width: 100px; height: 30px; " >
                 </ td >
               
                 < td style = " width: 100px; height: 30px; " >
                     & nbsp; < asp:GridView ID = " GridView1 "  runat = " server "  AutoGenerateColumns = " false "  OnRowDataBound = " GridView1_RowDataBound "  Width = " 326px "  OnRowCreated = " GridView1_RowCreated " >
                     < Columns >
                    
                      < asp:BoundField DataField = " Name "  HeaderText = " Name " />
                      < asp:BoundField DataField = " Address "  HeaderText = " Address "   />
                     </ Columns >
                     </ asp:GridView >
                 </ td >
                 < td style = " width:300; height: 30px; " >
                   < div id = " Popup "   class = " transparent "  style = " Z-INDEX:200; " >
                     < table style = " width: 300 " >
                         < tr >
                             < td style = " width: 100px "  id = " td1 " >
                             </ td >
                           
                         </ tr >
                         < tr >
                             < td style = " width: 100px; height: 21px; "  id = " td2 " >
                             </ td >
                         </ tr >
                     </ table >
                     </ div >
                 </ td >
             </ tr >
         </ table >
    
     </ div >
     </ form >
</ body >
</ html >
－－－－－－－－－－－－－－－－－－－－－－－－－－－－
using  System;
using  System.Data;
using  System.Configuration;
using  System.Web;
using  System.Web.Security;
using  System.Web.UI;
using  System.Web.UI.WebControls;
using  System.Web.UI.WebControls.WebParts;
using  System.Web.UI.HtmlControls;
using  System.Data.SqlClient;

public  partial  class  _Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!this.IsPostBack)
        {
            getDate();
        }
    }

    public void getDate()
    {
        SqlConnection con = new SqlConnection("server=server01;database=test;uid=sa;pwd=sql");
        con.Open();
        SqlDataAdapter da = new SqlDataAdapter("select * from tab", con);
        DataSet ds = new DataSet();
        da.Fill(ds);
        GridView1.DataSource = ds;
        GridView1.DataBind();
    }
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            e.Row.Attributes.Add("onmouseover", "currentcolor=this.style.backgroundColor;this.style.backgroundColor='#C0C0FF';this.style.cursor='hand';showDetail('" + e.Row.Cells[0].Text + "','" + e.Row.Cells[1].Text + "')");
        

            e.Row.Attributes.Add("onmouseout", "hide();this.style.backgroundColor=currentcolor;");
           

        }
    }
    protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
    {

        //if (e.Row.RowType == DataControlRowType.DataRow)
        //{
        //    e.Row.Attributes.Add("onmouseover", "currentcolor=this.style.backgroundColor;this.style.backgroundColor='#C0C0FF';this.style.cursor='hand';");
        //    当鼠标移走时还原该行的背景色
        //    //e.Row.Attributes.Add("onmouseover", "showDetail('" + e.Row.Cells[0].Text + "','" + e.Row.Cells[1].Text + "')");

        //    e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor;hide();");

        //}
    }
}

转载于:https://www.cnblogs.com/jame-peng1028/archive/2007/05/14/746464.html