1.建立一aspx頁面，html代碼2.cs代碼

using?System.Data.SqlClient;
using?System.IO;
protected?void?Page_Load(object?sender,?EventArgs?e)
????{
????????if?(!Page.IsPostBack)
????????{
????????????BindData();
????????????
????????}
????????if?(ID?!=?"")
????????{
????????????GetDescriptionByID(ID);
????????}
????????
????}

????property#region?property
????private?string?ID
????{
????????get
????????{
????????????if?(Request["ID"]?!=?null?&&?Request["ID"].ToString()?!=?"")
????????????{
????????????????return?Request["ID"];
????????????}
????????????else
????????????{
????????????????return?"";
????????????}
????????}
????}
????#endregion

????GetDescriptionByID#region?GetDescriptionByID
????private?void?GetDescriptionByID(string?ID)
????{
????????string?connStr?=?ConfigurationSettings.AppSettings["ConnectionString"];
????????SqlConnection?conn?=?new?SqlConnection(connStr);
????????string?sql?=?"select?*?from?testimage?where?userid='"?+?ID?+?"'";
????????SqlCommand?cmd?=?new?SqlCommand(sql,?conn);
????????conn.Open();
????????SqlDataReader?dr?=?cmd.ExecuteReader();

????????string?s?=?@"<table?cellspacing='0'?cellpadding='4'?width='300'?height='200'?border='0'?id='GridView1'?style='color:#333333;border-collapse:collapse;'>";
????????if(dr.Read())
????????{
????????????s?+=?"<tr?style='color:#333333;background-color:#FFFBD6;'>";
????????????s?+=?"<td?width='50'>名稱:</td>";
????????????s?+=?"<td>"?+?dr["UserName"]?+?"</td>";
????????????s?+=?"</tr>";
????????????s?+=?"<tr?style='color:#333333;background-color:White;'>";
????????????s?+=?"<td?scope='col'>描述:</td>";
????????????s?+=?"<td>"?+?dr["Description"]?+?"</td>";
????????????s?+=?"</tr>";
????????}
????????s?+=?"</table>";
????????dr.Close();
????????conn.Close();
????????this.Response.Write(s);
????????this.Response.End();
????}
????#endregion

????save?image#region?save?image
????protected?void?Button2_Click(object?sender,?EventArgs?e)
????{
????????Stream?ImageStream;
????????string?Path?=?FileUpload1.PostedFile.FileName;//?文件名稱
????????int?Size?=?FileUpload1.PostedFile.ContentLength;?//?文件大小
????????string?Type?=?FileUpload1.PostedFile.ContentType;?//?文件類型
????????ImageStream?=?FileUpload1.PostedFile.InputStream;
????????byte[]?Content?=?new?byte[Size];
????????int?Status?=?ImageStream.Read(Content,?0,?Size);

????????SqlConnection?conn?=?new?SqlConnection(ConfigurationSettings.AppSettings["ConnectionString"]);
????????SqlCommand?comm?=?new?SqlCommand("insert?into?testimage?(UserName,Image,Path,Type,Description)?values(@UserName,@Image,@Path,@Type,@Description)",?conn);

????????comm.CommandType?=?CommandType.Text;
????????comm.Parameters.Add("@UserName",?SqlDbType.VarChar,?255).Value?=?txtUserName.Text;
????????comm.Parameters.Add("@Image",?SqlDbType.Image).Value?=?Content;
????????comm.Parameters.Add("@Path",?SqlDbType.VarChar,?255).Value?=?Path;
????????comm.Parameters.Add("@Type",?SqlDbType.VarChar,?255).Value?=?Type;
????????comm.Parameters.Add("@Description",?SqlDbType.VarChar,?2000).Value?=?this.TextBox1.Text;

????????conn.Open();
????????comm.ExecuteNonQuery();
????????conn.Close();
????}
????#endregion

????BindData#region?BindData
????private?void?BindData()
????{
????????string?sql?=?"select?*?from?testimage";
????????DataSet?ds?=?GetDataSet(sql);
????????this.DataList1.DataSource?=?ds;
????????this.DataList1.DataBind();
????}
????#endregion

????GetDataSet#region?GetDataSet
????private?DataSet?GetDataSet(string?sql)
????{
????????string?constring?=?System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
????????SqlDataAdapter?sda?=?new?SqlDataAdapter(sql,?constring);
????????DataSet?ds?=?new?DataSet();
????????sda.Fill(ds);
????????return?ds;
????}
????#endregion 3.數據庫腳本
if?exists?(select?*?from?dbo.sysobjects?where?id?=?object_id(N'[dbo].[TestImage]')?and?OBJECTPROPERTY(id,?N'IsUserTable')?=?1)
drop?table?[dbo].[TestImage]
GO

CREATE?TABLE?[dbo].[TestImage]?(
????[UserID]?[int]?IDENTITY?(1,?1)?NOT?NULL?,
????[UserName]?[nvarchar]?(500)?COLLATE?Chinese_PRC_CI_AS?NULL?,
????[Image]?[image]?NULL?,
????[Path]?[nvarchar]?(500)?COLLATE?Chinese_PRC_CI_AS?NULL?,
????[Type]?[nvarchar]?(20)?COLLATE?SQL_Latin1_General_CP1_CI_AS?NULL?,
????[Description]?[nvarchar]?(2000)?COLLATE?Chinese_PRC_CI_AS?NULL?
)?ON?[PRIMARY]?TEXTIMAGE_ON?[PRIMARY]
GO ?

<html>
?<head>
??<title>WebForm1</title>
??<style?type="text/css">.logo?{}{?POSITION:?absolute?}.dek?{}{?Z-INDEX:?200;?VISIBILITY:?hidden;?POSITION:?absolute?}</style>
?</head>
?<body>
?<Form?runat="server">
??<DIV?class="dek"?id="dek"></DIV>
????<script?language="javascript">??
????????Xoffset=-20;
????????Yoffset=??20;???????
????????var??nav,yyy=-1000;
????????var??skn=dek.style;
????????document.onmousemove=get_mouse;
????????
????????//ajax
????????var?xmlHttp;????????
????????function?createXMLHttpRequest()?
????????{
????????????if?(window.ActiveXObject)?
????????????{
????????????????xmlHttp?=?new?ActiveXObject("Microsoft.XMLHTTP");
????????????}?
????????????else?if?(window.XMLHttpRequest)?
????????????{
????????????????xmlHttp?=?new?XMLHttpRequest();
????????????}
????????}
????????????
????????function?startRequest(id)?
????????{
????????????createXMLHttpRequest();
????????????xmlHttp.onreadystatechange?=?handleStateChange;
????????????xmlHttp.open("GET",?"?ID="+id,?true);
????????????xmlHttp.send(null);
????????}
????????var?content;????
????????function?handleStateChange()?
????????{
????????????if(xmlHttp.readyState?==?4)
????????????{
????????????????if(xmlHttp.status?==?200)
????????????????{
????????????????????content=xmlHttp.responseText;
????????????????}
????????????}
????????}
????????//tooltip
????????function??popup(id)
????????{
????????????startRequest(id);
????????????yyy=Yoffset;
????????????document.all("dek").innerHTML=content;
????????????skn.visibility="visible"
????????}

????????function??get_mouse(e)
????????{
????????????var??x=event.x+document.body.scrollLeft;
????????????skn.left=x+Xoffset;
????????????var??y=event.y+document.body.scrollTop;
????????????skn.top=y+yyy;
????????}

????????function??kill()
????????{
????????????yyy=-1000;
????????????skn.visibility="hidden";
????????}
</script>??
??<div>
????<asp:FileUpload?ID="FileUpload1"?runat="server"?/><br>名稱:<asp:TextBox?ID="txtUserName"
????????????runat="server"></asp:TextBox><br>
??????描述:<asp:TextBox?ID="TextBox1"?runat="server"></asp:TextBox><br>
????????<asp:Button?ID="Button2"?runat="server"?OnClick="Button2_Click"?Text="保存"?/>
????<asp:DataList?id="DataList1"
???????????BorderColor="black"
???????????CellPadding="1"
???????????CellSpacing="4"?HorizontalAlign="Center"
???????????RepeatColumns="4"
???????????RepeatLayout="Table"
???????????runat="server"?ShowFooter="true"?ShowHeader="true"
???????????width="100%">
?????????<ItemTemplate>
????????????<%#?DataBinder.Eval(Container.DataItem,?"UserName")%><br>
????????????<img?ID="img1"?onmouseover="popup(<%#?DataBinder.Eval(Container.DataItem,?"UserID")%>);"?οnmοuseοut="kill();"?src='<%#?DataBinder.Eval(Container.DataItem,?"Path")?%>'?height='150'/>
?????????</ItemTemplate>
??????</asp:DataList>????
????</div>
????</Form>
?</body>
</html>

總結

以上是生活随笔為你收集整理的Ajax实现DataGrid/DataList动态ToolTip的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。