|
藍森林 http://www.lslnet.com 2006年8月25日 8:28
 表格的出現和隱藏
是這樣的，我想按想>>詳細點擊就出現詳細的地點和電話什麼的，如果不按的就什麼都不顯示，但我現在的程序好像錯了，麻煩哪位能幫個忙
|
<a href="javascript:void(a.style.display='none')">隱藏</a>
<a href="javascript:void(a.style.display='')">顯示</a>
<table border=1 id=a>
<tr><td>
kjjk
</td></tr></table> |
| 我現在想挺一段代碼，就是有運行代碼的那種，我貼給你們看看，出了點問題 |
http://cosmos.madeinwx.com/enter/contact.asp
就是這一頁裡，我要點擊>>詳細點擊會出現隱藏了的表格，，默認時他是不出現的
就如http://www.cits.net/travel/travel/index.jsp
裡面點個more就出現更多 |
[html]
<html>
<head>
<title>Hideandshow</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--
td { font-size: 12px; line-height: 150%; letter-spacing: 1px; font-family: "Verdana", "Arial", "Helvetica", "sans-serif"}
a { text-decoration: none}
a:hover { color: #FF0000}
.unnamed2 { border: 1px #EEEDEA solid; background-color: #FeFeFe; scrollbar-arrow-color:#ffffff;crollbar-base-color:#FeFeFe;scrollbar-shadow-color:#cccccc; scrollbar-face-color:#EEEDEA;scrollbar-highlight-color:#FeFeFe;scrollbar-dark-shadow-color:white;scrollbar-3d-light-color:#ffffff; font-family: "Verdana", "Arial", "Helvetica", "sans-serif"; font-size: 12px; color: #CCCCCC}
body {scrollbar-arrow-color:#ffffff;crollbar-base-color:#FeFeFe;scrollbar-shadow-color:#cccccc; scrollbar-face-color:#EEEDEA;scrollbar-highlight-color:#FeFeFe;scrollbar-dark-shadow-color:white;scrollbar-3d-light-color:#ffffff}
.exheading {cursor: hand}
.exindent {cursor: hand}
-->
</style>
<!-- Please do not edit this following scripts -->
<script language="JavaScript">
//begin IE 4+ And NS6 dHTML Outlines
function hideshow(which)
{
if (!document.getElementById|document.all)
{
return
}
else
{
if (document.getElementById)
{
oWhich = eval ("document.getElementById('" + which + "')")
}
else
{
oWhich = eval ("document.all." + which)
}
}
window.focus()
if (oWhich.style.display=="none")
{
oWhich.style.display=""
}
else
{
oWhich.style.display="none"
}
}
//end IE 4+ And NS6 dHTML Outlines
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" link="#999933" vlink="#0066FF" alink="#00FF00" >
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" align="center" width="100%"> <table border="0" cellspacing="1" cellpadding="3" bgcolor="#333333" width="95%" align="center">
<tr bgcolor="#EEEDEA">
<!-- 編輯 outlineChild和outlineParent後面的參數-->
<td height="18" colspan="3" bgcolor="#CCCC33"> <div id="outlineParent1" onClick="javascript:hideshow('outlineChild1')" class="exheading">Click
On me</div></td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td></td>
</tr>
</table>
<!-- 編輯outlineChild後面的參數，要和上面的參數統一 -->
<div id="outlineChild1" style="display:none;" class="exindent">
<table width="95%" border="0" cellspacing="1" cellpadding="0" bgcolor="#000000">
<tr bgcolor="#FFFFFF" align="center">
<td height="18" width="10%">1</td>
<td height="18" width="10%">2</td>
<td height="18" width="12%">3</td>
</tr>
<tr bgcolor="#FFFFFF" align="center">
<td height="18" width="10%">4</td>
<td height="18" width="10%">5</td>
<td height="18" width="12%">6</td>
</tr>
</table>
</div>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
[/html]
試試看這個是不是你要的效果。 :) |
[html]<HTML>
<HEAD>
<TITLE>Xixi</TITLE>
<META http-equiv=Content-Type content=text/html;charset=gb2312>
<STYLE type=text/css>.unnamed1 {
BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid
}
TD {
FONT-SIZE: 12px; FONT-FAMILY: "Verdana", "Arial", "Helvetica", "sans-serif"
}
.unnamed2 {
COLOR: #ffffff
}
.unnamed3 {
FONT-SIZE: 12px; LINE-HEIGHT: 180%; FONT-FAMILY: "Verdana", "Arial", "Helvetica", "sans-serif"
}
</STYLE>
<SCRIPT language=JScript>
<!--
function checkKey()
{
var key = window.event.keyCode;
if (window.event.shiftKey)
{
if (key == 65 || key == 97)
{
ShowAll();
}
else if (key == 67 || key == 99)
{
CloseAll();
}
}
}
function ShowAll()
{
for(var i = 0; i < document.all.length; i++)
{
if (document.all(i).className == "collapsed")
{
document.all(i).className = "expanded" ;
}
}
}
function CloseAll()
{
for(var i = 0; i < document.all.length; i++)
{
if (document.all(i).className == "expanded")
{
document.all(i).className = "collapsed" ;
}
}
}
function outliner()
{
var child = document.all[event.srcElement.getAttribute("child",false)];
if (null != child){
if(child.className == "collapsed")
{
child.className = "expanded";
return;
}
if(child.className == "expanded")
{
child.className = "collapsed";
return;
}
}
}
//-->
</SCRIPT>
<STYLE>
.expanded {
}
.collapsed {
DISPLAY: none
}
.line {
CURSOR: hand
}
</STYLE>
<SCRIPT>document.write("<base target=_blank>")</SCRIPT>
<META content="Microsoft FrontPage 5.0" name=GENERATOR>
<script language="JavaScript">
<!--
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->
//-->
</script>
</HEAD>
<BODY text=#000000 vLink=#000000 aLink=#ff0000 link=#000000 bgColor=#dedede id=body style="cursor:default;">
<TABLE cellSpacing=0 cellPadding=0 width="90%" border=0>
<TBODY>
<TR>
<TD valign="top" align="left">
<p>
<TABLE height=20 cellSpacing=0 cellPadding=6 width=100% align=center border=1>
<TBODY>
<TR>
<TD width=100% rowSpan=2> <TABLE cellSpacing=0 cellPadding=0 width=100% align=center border=0>
<TBODY>
<TR onmouseover="this.bgColor='#eeeeee';"
onmouseout="this.bgColor='#ffffcc';">
<TD class=black style="CURSOR: hand" onclick=outliner() align=middle
width=100% height=20 NAME="NAME_ALL"
child="ALL"><詳情請點擊></TD>
</TR>
</TBODY>
</TABLE></TD>
</TR>
</TBODY>
</TABLE>
<DIV class=collapsed id=ALL>
<TABLE cellSpacing=0 cellPadding=0 width=100% align=center border=0>
<TBODY>
<TR>
<TD width=100% bgColor=#ffffcc>
<TABLE cellSpacing=0 cellPadding=12 width="100%" align=center border=1 bordercolor="#000000">
<TBODY>
<TR>
<TD bgcolor="#CCFFFF" bordercolor="#CCFFFF">Contants</TD>
</TR>
</TBODY>
</TABLE></TD>
</TR>
</TBODY>
</TABLE>
<TABLE height=20 cellSpacing=0 cellPadding=0 width=100% align=center border=0>
<TBODY>
<TR>
<TD width=100% rowSpan=2> <TABLE cellSpacing=0 cellPadding=0 width=100% align=center border=0>
<TBODY>
<TR onmouseover="this.bgColor='#eeeeee';"
onmouseout="this.bgColor='#ffffcc';">
<TD class=black style="CURSOR: hand" onclick=outliner() align=middle
height=20 NAME="NAME_ALL"
child="ALL"><關閉></TD>
</TR>
</TBODY>
</TABLE></TD>
</TR>
</TBODY>
</TABLE>
</DIV></TD>
</TR>
</TBODY>
</TABLE>
</BODY></HTML>
[/html]
再試試看這個吧，嘿嘿嘿嘿。 |
|
