读书人

iframe 模式实现 tab 页,首页主动加载

发布时间: 2012-09-05 15:19:34 作者: rapoo

iframe 方式实现 tab 页,首页主动加载,其它页点击时加载

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>TAB信息</title><script language="javascript"> var CurrSelNo = 0; //当前选中的页签var MaxTabs = 7;//页签的数目function HovIt(objname) {if (CurrSelNo != objname) {var btn1 = 'tabInfotd' + objname;var btn2 = btn1 + 'R';document.getElementById(btn1).className = 'tabInfoHovT';document.getElementById(btn2).className = "tabInfoHovTR";}}function DefIt(objname) {if (CurrSelNo != objname) {var btn1 = 'tabInfotd' + objname;var btn2 = btn1 + 'R';document.getElementById(btn1).className = 'tabInfoDefT';document.getElementById(btn2).className = "tabInfoDefTR";}}function SelIt(objname) {var btn1;var btn2;for (i = 0; i < MaxTabs; i++) {btn1 = 'tabInfotd' + i;btn2 = btn1 + 'R';document.getElementById(btn1).className = 'tabInfoDefT';document.getElementById(btn2).className = "tabInfoDefTR";document.getElementById('tabInfo_frame' + i).style.display = 'none';}btn1 = 'tabInfotd' + objname;btn2 = btn1 + 'R';document.getElementById(btn1).className = 'tabInfoSelT';document.getElementById(btn2).className = "tabInfoSelTR";document.getElementById('tabInfo_frame' + objname).style.display = '';switch(objname){case '0': document.getElementById('tabInfo_frame' + objname).src = '${pageContext.request.contextPath}/searchParty/searchParty_goSearchParty.action';break;case '1': document.getElementById('tabInfo_frame' + objname).src = '${pageContext.request.contextPath}/searchParty/searchParty_goFindParty.action';break;default: document.getElementById('tabInfo_frame' + objname).src = '${pageContext.request.contextPath}/maintainParty/maintainParty_goAddParty.action';}//if(objname == 0){//document.getElementById('tabInfo_frame' + objname).src = '${pageContext.request.contextPath}/searchParty/searchParty_goSearchParty.action';//}CurrSelNo = objname;}</script></head><body><style type=text/css>.tabInfoSelT {height: 22xp;font-family: Microsoft Sans Serif;font-size: 8pt;color: Black;padding: 2px 0 2px 7px;cursor: Default;background: url(images/ig_tab_winXP1.gif) no-repeat left top;}.tabInfoSelTR {width: 6px;cursor: Default;font-size: 2px;background: url(images/ig_tab_winXP1.gif) no-repeat right top;}.tabInfoDefT {border-width: 0px 0px 1px 0px;border-color: #949878;border-style: Solid;height: 22px;font-family: Microsoft Sans Serif;font-size: 8pt;color: Black;padding: 2px 0 0 7px;cursor: pointer;background: url(images/ig_tab_winXP3.gif) no-repeat left 2px;}.tabInfoDefTR {border-width: 0px 0px 1px 0px;border-color: #949878;border-style: Solid;width: 6px;cursor: pointer;font-size: 2px;background: url(images/ig_tab_winXP3.gif) no-repeat right 2px;}.tabInfoHovT {border-width: 0px 0px 1px 0px;border-color: #949878;border-style: Solid;height: 22px;font-family: Microsoft Sans Serif;font-size: 8pt;color: Black;padding: 2px 0 0 7px;cursor: pointer;background: url(images/ig_tab_winXP2.gif) no-repeat left 2px;}.tabInfoHovTR {border-width: 0px 0px 1px 0px;border-color: #949878;border-style: Solid;width: 6px;cursor: pointer;font-size: 2px;background: url(images/ig_tab_winXP2.gif) no-repeat right 2px;}</style><table border="0" cellspacing="0" cellpadding="0" id="igtabtabInfo" width="100%" height="100%" style="Z-INDEX:108;">  <tr><td>  <table id="tabInfo_tbl" cellspacing="0" cellpadding="0" border="0" width="100%">  <tr valign="center">    <td><table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%"><tr><td nowrap id="tabInfotd0" align="center" unselectable="on" onmouseover="HovIt('0')"onmouseout="DefIt('0')" onclick="SelIt('0')">基本信息</td><td nowrap id="tabInfotd0R" width="6px"unselectable="on" onmouseover="HovIt('0')"onmouseout="DefIt('0')" onclick="SelIt('0')"></td></tr></table></td>    <td><table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%"><tr><td nowrap id="tabInfotd1" align="center" unselectable="on" onmouseover="HovIt('1')"onmouseout="DefIt('1')" onclick="SelIt('1')">证件信息</td><td nowrap id="tabInfotd1R" width="6px"unselectable="on" onmouseover="HovIt('1')"onmouseout="DefIt('1')" onclick="SelIt('1')"></td></tr></table></td>    <td><table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%"><tr><td nowrap id="tabInfotd2" align="center" unselectable="on" onmouseover="HovIt('2')"onmouseout="DefIt('2')" onclick="SelIt('2')">地址信息</td><td nowrap id="tabInfotd2R" width="6px"unselectable="on" onmouseover="HovIt('2')"onmouseout="DefIt('2')" onclick="SelIt('2')"></td></tr></table></td>    <td><table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%"><tr><td nowrap id="tabInfotd3" align="center" unselectable="on" onmouseover="HovIt('3')"onmouseout="DefIt('3')" onclick="SelIt('3')">联系信息</td><td nowrap id="tabInfotd3R" width="6px"unselectable="on" onmouseover="HovIt('3')"onmouseout="DefIt('3')" onclick="SelIt('3')"></td></tr></table></td>    <td><table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%"><tr><td nowrap id="tabInfotd4" align="center" unselectable="on" onmouseover="HovIt('4')"onmouseout="DefIt('4')" onclick="SelIt('4')">账户信息</td><td nowrap id="tabInfotd4R" width="6px"unselectable="on" onmouseover="HovIt('4')"onmouseout="DefIt('4')" onclick="SelIt('4')"></td></tr></table></td>    <td><table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%"><tr><td nowrap id="tabInfotd5" align="center" unselectable="on" onmouseover="HovIt('5')"onmouseout="DefIt('5')" onclick="SelIt('5')">计划信息</td><td nowrap id="tabInfotd5R" width="6px"unselectable="on" onmouseover="HovIt('5')"onmouseout="DefIt('5')" onclick="SelIt('5')"></td></tr></table></td>    <!--复制此段,并将tabInfotd(X)和tabInfotd(X)R改为相应增加的数值,后面的HovIt,DefIt,SelIt函数的调用值也要修改 -->    <td><table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%"><tr><td nowrap id="tabInfotd6" align="center" unselectable="on" onmouseover="HovIt('6')"onmouseout="DefIt('6')" onclick="SelIt('6')">合同信息</td><td nowrap id="tabInfotd6R" width="6px"unselectable="on" onmouseover="HovIt('6')"onmouseout="DefIt('6')" onclick="SelIt('6')"></td></tr></table></td>    <!--段落结束--><td nowrap style="font-size: 2px; cursor: default; border-width: 0px 0px 1px 0px; border-color: #949878; border-style: Solid; width: 90%;"></td></tr>  </table>   </td></tr> <tr> <td id="tabInfo_cp" bgcolor="#FEFCFD" style="border-width:0px 1px 1px 1px;border-color:#949878; border-style:Solid;background-color:#FEFCFD;padding:3px 0px 0px 0px;height:500px;width:803px;"> <!-- 默认加载可以直接写在 src 上 -->  <iframe id="tabInfo_frame0" src="${pageContext.request.contextPath}/searchParty/searchParty_goSearchParty.action" style="" frameborder="0" width="100%" height="100%"></iframe>  <iframe id="tabInfo_frame1" style="display:none;" frameborder="0" width="100%" height="100%"></iframe>  <iframe id="tabInfo_frame2" style="display:none;" frameborder="0" width="100%" height="100%"></iframe>  <iframe id="tabInfo_frame3" style="display:none;" frameborder="0" width="100%" height="100%"></iframe>  <iframe id="tabInfo_frame4" style="display:none;" frameborder="0" width="100%" height="100%"></iframe>  <iframe id="tabInfo_frame5" style="display:none;" frameborder="0" width="100%" height="100%"></iframe>  <!--复制此段,并将tabInfo_frame改为相应增加的数值 -->  <iframe id="tabInfo_frame6" style="display:none;" frameborder="0" width="100%" height="100%"></iframe>  <!--段落结束-->  <div width="100%" height="100%" id="tabInfo_empty" style="display:none"> </div> </td></tr></table></body></html>
?

读书人网 >Web前端

热点推荐