如何在asp里实现类似pb的tab页的功能?

peytonzwt 2003-08-20 01:57:14
如何在asp里实现类似pb的tab页的功能?各位老大谁有代码啊?
...全文
83 10 打赏 收藏 转发到动态 举报
写回复
用AI写文章
10 条回复
切换为时间正序
请发表友善的回复…
发表回复
peytonzwt 2003-08-20
  • 打赏
  • 举报
回复
好的,收到了,谢谢。不管能不能用都要给分了。
liuzxit 2003-08-20
  • 打赏
  • 举报
回复
天啊﹐怎么貼著貼著內容又刪掉一些﹐寄給你吧
liuzxit 2003-08-20
  • 打赏
  • 举报
回复
終于等到回復了﹐CSDN限制三次回復﹐真麻煩﹐以上是剩下部分﹐我在IE5.5試過可以
liuzxit 2003-08-20
  • 打赏
  • 举报
回复
function SetDefaults()
{
if(tagName=="container")
{
CustomDefault('td--tab-orientation', 'tdTabOrientation', 'top');
NormalDefault('width', 'auto');
NormalDefault('height', 'auto');
NormalDefault('background', 'buttonface');
NormalDefault('color', 'buttontext');
}
}

function CustomDefault(sCSSName, sScriptName, sDefault)
{
if (currentStyle[sCSSName] == null)
{
style[sCSSName] = sDefault;
}
else style[sCSSName] = currentStyle[sCSSName];
style[sScriptName] = style[sCSSName];
}

function NormalDefault(sCSSName, sDefault)
{
if (style[sCSSName] == "" || style[sCSSName] == null)
{
style[sCSSName] = sDefault;
}
}

function SelectTab()
{
var oContainer = null;
if(tagName=="container") oContainer = element;
if(tagName=="page") oContainer = parentElement;
if(isNaN(parseInt(oContainer.selectedIndex)))
{
for(i=0; i<oContainer.children.length; i++)
{
if(oContainer.children(i).TABTEXT==oContainer.selectedIndex) oContainer.selectedIndex = i + 1;
}
if(isNaN(parseInt(oContainer.selectedIndex))) oContainer.selectedIndex = 1;
}

if(oContainer.selectedIndex > oContainer.children.length)
{
var TempClass = oContainer.children(0).children(1).className;
TempClass = "ActiveTab" + TempClass.substring(TempClass.indexOf("_"), TempClass.length);
oContainer.children(0).children(1).className = TempClass;
return;
}

var TempClass = oContainer.children(oContainer.selectedIndex-1).children(1).className;
TempClass = "ActiveTab" + TempClass.substring(TempClass.indexOf("_"), TempClass.length);
oContainer.children(oContainer.selectedIndex-1).children(1).className = TempClass;
}

function DeselectTab()
{
var oContainer = null;
if(tagName=="container") oContainer = element;
if(tagName=="page") oContainer = parentElement;

for(i=0; i<oContainer.children.length; i++)
{
var TempClass = oContainer.children(i).children(1).className;
TempClass = "DormantTab" + TempClass.substring(TempClass.indexOf("_"), TempClass.length);
oContainer.children(i).children(1).className = TempClass;
}
}

peytonzwt 2003-08-20
  • 打赏
  • 举报
回复
liuzxit(关系是第一生产力) 不行啊,你用过了没有啊?能给我发一个例子吗?包括原代码和页面。发到zhouweitao@sina.com
liuzxit 2003-08-20
  • 打赏
  • 举报
回复
function MakeTab(iLeft, iWidth, sLabel, sTitle, iIndex)
{
var sTopDisplay = null;
var sBottomDisplay = null;
if(parentElement.style.tdTabOrientation.toUpperCase()=="TOP")
{
sTopDisplay = "inline";
sBottomDisplay = "none";
}
if(parentElement.style.tdTabOrientation.toUpperCase()=="BOTTOM")
{
sTopDisplay = "none";
sBottomDisplay = "inline";
}

var sHTML = "";
sHTML = sHTML + '<TABLE ID=Tab onclick="parentElement.parentElement.selectedIndex = this.index" CLASS=DormantTab_' + uniqueID + ' index=' + iIndex + ' CELLPADDING=0 CELLSPACING=0 STYLE="left:' + iLeft + '">';
sHTML = sHTML + '<TR STYLE="display:' + sTopDisplay + '">';
sHTML = sHTML + '<TD STYLE="width:1px; height:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD STYLE="width:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=LightShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD STYLE="width:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD STYLE="width:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '</TR>';
sHTML = sHTML + '<TR STYLE="display:' + sTopDisplay + '">';
sHTML = sHTML + '<TD CLASS=Transparent_' + uniqueID + ' STYLE="height:1px"></TD>';
sHTML = sHTML + '<TD CLASS=LightShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=Tab_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=DarkShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '</TR>';
sHTML = sHTML + '<TR>';
sHTML = sHTML + '<TD CLASS=LightShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=Tab_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=Tab_' + uniqueID + ' TITLE="' + sTitle + '" STYLE="font:9pt MS Sans Serif; width:' + iWidth + '; height:20px; padding-left:4px; padding-right:4px">' + sLabel + '</TD>';
sHTML = sHTML + '<TD CLASS=MediumShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=DarkShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '</TR>';
sHTML = sHTML + '<TR STYLE="display:' + sBottomDisplay + '">';
sHTML = sHTML + '<TD CLASS=Transparent_' + uniqueID + ' STYLE="height:1px"></TD>';
sHTML = sHTML + '<TD CLASS=LightShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=Tab_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=DarkShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '</TR>';
sHTML = sHTML + '<TR STYLE="display:' + sBottomDisplay + '">';
sHTML = sHTML + '<TD STYLE="width:1px; height:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD STYLE="width:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD CLASS=DarkShadow_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD STYLE="width:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '<TD STYLE="width:1px" CLASS=Transparent_' + uniqueID + '></TD>';
sHTML = sHTML + '</TR>';
sHTML = sHTML + '</TABLE>';

insertAdjacentHTML('BeforeEnd', sHTML);
}


function CreatePageStyleSheet()
{
// Create Page StyleSheet page
element.document.body.MPCPageStyleSheet = element.document.createStyleSheet();
StyleInfo = element.document.body.MPCPageStyleSheet;

//get values of container background color and foreground color
var sForeColor = parentElement.style.color;
var sBackColor = parentElement.style.background;

//determine value of iTop for placement of tabs
var iTop = null;
if(parentElement.style.tdTabOrientation.toUpperCase() == "TOP") iTop = -22;
if(parentElement.style.tdTabOrientation.toUpperCase() == "BOTTOM") iTop = parentElement.style.posHeight - 2;


StyleInfo.addRule( '.Transparent_' + uniqueID, 'width:1px; height:1px; font-size:0px');
StyleRules['Transparent'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.LightShadow_' + uniqueID, 'background:white; font-size:0px');
StyleRules['LightShadow'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.MediumShadow_' + uniqueID, 'background:gray; font-size:0px');
StyleRules['MediumShadow'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.DarkShadow_' + uniqueID, 'background:black; font-size:0px');
StyleRules['DarkShadow'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.Tab_' + uniqueID, 'background:' + sBackColor + '; color:' + sForeColor);
StyleRules['Tab'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.DormantTab_' + uniqueID, 'position:absolute; z-index:2; cursor:default');
StyleRules['DormantTab'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.ActiveTab_' + uniqueID, 'position:absolute; z-index:4; cursor:default');
StyleRules['ActiveTab'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.DormantContent_' + uniqueID, 'position:absolute; visibility:hidden; top:0; left:0; background:silver');
StyleRules['DormantContent'] = StyleInfo.rules[StyleInfo.rules.length-1].style;

StyleInfo.addRule( '.ActiveContent_' + uniqueID, 'position:absolute; height:100%; width:100%; border-left:solid 1 white; border-top:solid 1 white; border-bottom:solid 1 black; border-right:solid 1 black; background:' + sBackColor + '; z-index:3');
StyleRules['ActiveContent'] = StyleInfo.rules[StyleInfo.rules.length-1].style;


}
liuzxit 2003-08-20
  • 打赏
  • 举报
回复
=====mpc.htc========
<PROPERTY NAME="selectedIndex"/>
<PROPERTY NAME="CumulativeTabWidth"/>
<PROPERTY NAME="ContainerHeight"/>

<EVENT NAME="onchange" ID="change" />
<EVENT NAME="onfocus" ID="focus" />

<METHOD NAME="FireFocus"/>

<ATTACH EVENT="ondocumentready" HANDLER="DoInit" />


<SCRIPT LANGUAGE="jscript">
var StyleInfo;
var StyleRules = new Array();
var iIndex = null;
function DoInit()
{
//if container....
if(tagName=="container")
{
style.position = "absolute";
CumulativeTabWidth = -1;
if(selectedIndex==null) selectedIndex = 1;
SetDefaults();
ContainerHeight = style.posHeight;
}

if(tagName=="page")
{
var iIndex = null;
for(c=0; c<parentElement.children.length; c++)
{
if(element == parentElement.children(c)) iIndex = c + 1;
}


//create and insert the HTML that is the content area for the tab
MakeContent();

//determine the width of this tab, using a simple algorithm (fairly reliable,
//since the font family and size are restricted
var iWidth = 6*parseInt(TABTEXT.length);

//create and insert the HTML that is the tab
MakeTab(parentElement.CumulativeTabWidth+1, iWidth+6, TABTEXT, TABTITLE, iIndex);

//reset CumulativeTabWidth
parentElement.CumulativeTabWidth = parentElement.CumulativeTabWidth + iWidth + 18;

//create a stylesheet for the tab
CreatePageStyleSheet();

//determine which tab in the collection this one is. If last, do some configuring
var Tabs = window.document.all("Tab");
if(parentElement.children.length == 1)
{
SelectTab();
SelectContent();
SetTabTop();
ConfirmContainerWidth();
SetContainerHeight();
}
else
{
if(Tabs.length == parentElement.children.length)
{
SelectTab();
SelectContent();
SetTabTop();
ConfirmContainerWidth();
SetContainerHeight();
}
}

}
attachEvent("onpropertychange", DoPropChange);
}

function MakeContent()
{

var sHTML = '<DIV onclick="window.event.cancelBubble = true" CLASS=DormantContent_' + uniqueID + '>' + innerHTML + '</DIV>';
innerHTML = "";
insertAdjacentHTML('BeforeEnd', sHTML);

}
liuzxit 2003-08-20
  • 打赏
  • 举报
回复
給一個別人的給你

=========mpc.htm===========
<HTML xmlns:mpc>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>mpc</TITLE>
<STYLE>
mpc\:container,mpc\:page{
behavior:url(mpc.htc);
}
</STYLE>
</HEAD>

<BODY BGCOLOR="#FFFFFF" ONLOAD="oMPC.style.visibility='visible'" text="#000000">
<div style="position:absolute;height:200;width:400;margin-top:20">
<mpc:container ID="oMPC" STYLE="width:400; height:200; visibility:hidden">
<mpc:page ID="tab1" TABTITLE="這是一個表格" TABTEXT="表格 "><br><br><table ALIGN="CENTER" STYLE="border:1 solid;font:20pt; width:300; height:150; color:white"><tr><td VALIGN="MIDDLE" ALIGN="CENTER">這是一個表格</td></tr></table><br><br></mpc:page>
<mpc:page ID="tab2" TABTITLE="這裡可以寫入文本" TABTEXT="文本文字 "><div STYLE="padding:12px; font:10pt; font-style:italic">請在這裡寫入文字 </div>
</mpc:page> <mpc:page ID="tab3" TABTITLE="這是圖像" TABTEXT="圖像 "> <img src=sample.jpg border=1 hspace="75" vspace="30">
</mpc:page> <mpc:page ID="tab4" TABTITLE="這是可以是其他內容" TABTEXT="其他內容 "><br> <a href=#><font face="楷體_GB2312" size="2">超級鏈接</font></a></mpc:page>
</mpc:container> </div>
</BODY>
</HTML>
lions911 2003-08-20
  • 打赏
  • 举报
回复
ASPNET里面有TABSCRIPT控件可以实现你要的效果。

ASP里面只能模拟完成吧。
peytonzwt 2003-08-20
  • 打赏
  • 举报
回复
有没有人知道啊?我很着急的。谢谢了!

28,391

社区成员

发帖
与我相关
我的任务
社区描述
ASP即Active Server Pages,是Microsoft公司开发的服务器端脚本环境。
社区管理员
  • ASP
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧