客户端独立弹出详细的实现过程

拷贝粘贴以下代码段，保存为html文件，试试看效果如何吧。。。
前几天贴子没写东西就搁在上面搁了几天，真不好意思。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<HTML>

<HEAD>

</HEAD>

<body>

function PopupDetailBoard()

{

this.sContext="";

this.sTitle="";

this.AddTextLine=AddTextLine;

this.AddTitle=AddTitle;

function AddTextLine(title,context)

{

this.sContext=this.sContext+"<tr><td align=left width=30% valign=top><b><font face=arial>"+title+":</font></b></td><td width=70% valign=top><font face=arial>"+context+"</font></td></tr>";

}

function AddTitle(context)

{

this.sTitle="<b>    "+context+"</b>";

}

this.ShowDetailBoard=ShowDetailBoard;

function ShowDetailBoard(Title,xpos,ypos,width,height)

{

var oPopup = window.createPopup();

var oPopBody = oPopup.document.body;

oPopBody.style.backgroundColor = "white";

oPopBody.style.boderTop="solid buttonhighlight 2px";

oPopBody.style.boderLeft="solid buttonhighlight 2px";

oPopBody.style.boderRight="solid buttonshadow 2px";

oPopBody.style.boderBottom="solid buttonshadow 2px";

var headerHeight;

headerHeight=height/14;

headerHeight=parseInt(headerHeight);

this.sContext="<table width=100%>"+this.sContext+"</table>";

oPopBody.innerHTML = "<table width=100% height=99% cellpadding=0 cellspacing=1><tr><td><table width=100% bgcolor=#d6d3ce border=1 height="+headerHeight+" style='border-collapse:collapse;border-top:1px solid buttonhighlight;border-left:1px solid buttonhighlight;border-right:1px solid buttonshadow;border-bottom:1px solid buttonshadow'><tr><td><font style='font-weight:bold;letter-spacing:2px;font-size:12pt;font-family:arial'> "+Title+"</font></td></tr></table><table width=100% height=92% border=1 bgcolor='white'style='border-collapse:collapse;border-top:1px solid buttonhighlight;border-left:1px solid buttonhighlight;border-right:1px solid buttonshadow;border-bottom:1px solid buttonshadow'><tr><td><div style='overflow:auto;background-color:#f7f3ef;font-size:10pt;width:100%;height:99%;border-bottom:1px solid buttonhighlight;border-right:1px solid buttonhighlight;border-left:1px solid buttonshadow;border-top:1px solid buttonshadow'>"+this.sTitle+this.sContext+"</div></td></tr></table></td></tr></table>";

oPopup.show(xpos,ypos,width,height, document.body);

}

function ShowDetail(Key)

{

var table=document.all('cacheTable')

if(table.rows.length==0) return;

pdb=new PopupDetailBoard();

for(i=0;i<table.rows[0].cells.length;i++)

{

if(table.rows[0].cells[i].innerText=="序号")

{

for(j=1;j<table.rows.length;j++)

{

if(table.rows[j].cells[i].innerText==Key)

{

for(k=0;k<table.rows[1].cells.length;k++)

{

if(table.rows[0].cells[k].innerText!='GloablRecordID')

{

pdb.AddTextLine(table.rows[0].cells[k].innerText,table.rows[j].cells[k].innerText)

}

break;

}

pdb.ShowDetailBoard('您正在查看的信息是:',300,400,500,500)

}

function ShowDetailEx(tableName,Key,title)

{

var table=document.all(tableName)

if(table.rows.length==0) return;

pdb=new PopupDetailBoard();

for(i=0;i<table.rows[0].cells.length;i++)

{

if(table.rows[0].cells[i].innerText=="序号")

{

for(j=1;j<table.rows.length;j++)

{

if(table.rows[j].cells[i].innerText==Key)

{

for(k=0;k<table.rows[1].cells.length;k++)

{

if(table.rows[0].cells[k].innerText!='GloablRecordID')

{

pdb.AddTextLine(table.rows[0].cells[k].innerText,table.rows[j].cells[k].innerText)

}

break;

}

pdb.ShowDetailBoard(title,300,400,500,500)

}

</script>

<TABLE id="cacheTable" style="DISPLAY: none; WIDTH: 928px; BORDER-COLLAPSE: collapse; HEIGHT: 1px"

cellSpacing="1" cellPadding="1" width="928" border="1">

<TR>

<TD>应交移动话费</TD>

<TD>应交长途话费</TD>

<TD>减免移动话费</TD>

<TD>减免长途话费</TD>

</TR>

</TABLE>

<td>序号</td><td>公务号码</td><td>应交移动话费</td><td>应交长途话费</td><td>减免移动话费</td><td>减免长途话费</td><td>其他数量</td><td>其他现金</td><td>补缴金额</td><td>登记年月</td><td>查看详情</td>