作者laechan (小太保)
看板mud_sanc
标题Re: [分享] ASP 表格内容的动态显示/隐藏
时间Tue Jun 19 10:17:56 2012
我们常常会在一些网站看到左边分页有动态树状功能表
+种族 │
-职业 │
职业说明 │
-技能 │
技能说明 │
技能比较 │
比方你点了种族的 + 号，它就会显示..
-种族 │
种族说明 │
种族根据地 │
-职业 │
职业说明 │
-技能 │
技能说明 │
技能比较 │
这个用简单的 html 就可做到，以种族那一个为例(其它类似)..
<html>
<table>
<tr><th align=left width=100>
<input id=button1 type=button value='+' onclick='
if(document.getElementById("racebar").style.display=="none")
{
document.getElementById("racebar").style.display="block";
document.getElementById("button1").value="-"
}
else
{
document.getElementById("racebar").style.display="none";
document.getElementById("button1").value="+"
}
'>种族</th></tr>
<tr id=racebar style="display:none"><th align=left>
<a href="
http://xxx1" target=_blank>种族说明</a><BR>
<a href="
http://xxx2" target=_blank>种族根据地</a></th>
</th></tr>
</table>
</html>
上面的程式执行范例在底下的位址
http://sanclaechan.myweb.hinet.net/tree.html
(在页面点右键选检视原始码亦可看到)
它是纯 html 的，但是可以用它来模拟一些动态的效果。
另外，理论上 onclick 应该也可以用在超连结上，也就是做到
当你点一条超连结时，它就展开该连结底下的树状，语法应该是
<a id=xx1 href="
http://xx1" onclick=' ... '>xx1</a>
上面的意思就是，当我点一下超连结时，它触发 onclick 就去
做 onclick 里面的东西(把某个隐藏的 tr 展开)，这样的树状
功能表的执行效果，就会比 tree.html 还要更好。
以上分享给各位。
在 onclick 里面加上 if 去判断的部份，我已经在公司实作，
按钮可以少一个；树状结构的部份我则准备加到我预计在公司
释出的网站左边功能表上。
Laechan
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 210.61.157.53
1F：→ laechan :更新了一下那个网页. 06/19 18:32