日期:2014-05-18  浏览次数:20400 次

一个datalist或者repeater,如何实现鼠标移动到数据上就出现一个隐藏层并显示相关数据的详细资料?
一个datalist或者repeater,如何实现鼠标移动到数据上就出现一个隐藏层并显示相关数据的详细资料。想不出在同一个页面如何把的数据的id传到这个隐藏层中?

------解决方案--------------------
参考下:
<asp:TemplateColumn HeaderText= "姓名/查看 ">
<ItemTemplate>
<div style= "width:100% " onMouseOver= "MM_showHideLayers( 'layer <%# DataBinder.Eval(Container, "DataItem.EMP_ID ") %> ', ' ', 'show ') " onMouseOut= "MM_showHideLayers( 'layer <%# DataBinder.Eval(Container, "DataItem.EMP_ID ") %> ', ' ', 'hide ') ">
<a title= "查看 " href= 'EmpDetail.aspx?EmpID= <%# DataBinder.Eval(Container, "DataItem.EMP_ID ") %> ' style= "text-decoration:none; " > <%# DataBinder.Eval(Container, "DataItem.EMP_NAME ") %> </a>
<div id= 'layer <%=a%> ' onmouseover= "MM_showHideLayers( 'layer <%# DataBinder.Eval(Container, "DataItem.EMP_ID ") %> ', ' ', 'show ') " style= "left:30px; visibility:hidden; position:relative; margin:0px; padding:0px; top:-55px; background-color: #ffffff "
onmouseout= "MM_showHideLayers( 'layer <%# DataBinder.Eval(Container, "DataItem.EMP_ID ") %> ', ' ', 'hide ') ">
<div style= "background:#fff5d8; text-align:left; border:#ff7300 1px solid; width:200px; height:30px; position:absolute; padding:5px; ">
手机: <%# DataBinder.Eval(Container, "DataItem.EMP_MOBILE_TEL ") %> <BR>
邮箱: <%# DataBinder.Eval(Container, "DataItem.EMP_EMAIL ") %>
</div>
</div>
</div>
</ItemTemplate>
</asp:TemplateColumn>
------解决方案--------------------
有个地方: <%=a%> 换为 <%# DataBinder.Eval(Container, "DataItem.EMP_ID ") %>
否则
'layer <%# DataBinder.Eval(Container, "DataItem.EMP_ID ") %> 应改为
'layer <%=a%> %>
这样你的后台要定义个个变量 protected int a = 0 ;
JS:
function MM_findObj(n, d)
{
var p,i,x;
if(!d)
d=document;
if((p=n.indexOf( "? "))> 0&&parent.frames.length)
{
d=parent.frames[n.substring(p+1)].document;
n=n.substring(0,p);
}
if(!(x=d[n])&&d.all)
x=d.all[n];
for (i=0;!x&&i <d.forms.length;i++)
{ x=d.forms[i][n]; }
for(i=0;!x&&d.layers&&i <d.layers.length;i++)
{ x=MM_findObj(n,d.layers[i].document); }
if(!x && d.getElementById)
x=d.getElementById(n);
return x;
}

function MM_showHideLayers()
{
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i <(args.length-2); i+=3)
{
if ((obj=MM_findObj(args[i]))!=null)
{
v=args[i+2];
if (obj.style)
{
obj=obj.style;
v=(v== 'show ')? 'visible ':(v== 'hide ')? 'hidden ':v;
}
obj.visibility=v;
}
}
}