作者jackyeah1213 (frog)
看板Ajax
标题[问题] 表格tree的做法
时间Thu Feb 9 15:07:10 2012
http://ppt.cc/w_OD
上面网址是我想要做到的示意图
按下"行政部"之後
会跑出他相关的资料
再按一下"行政处"
则是缩起来
按下"文学院"
跑出"中国文学系""历史学系"
按下"历史学系" 跑出相对应资料
其余的同理@@
然後按下旁边菱形的图案
则是将所属的所有资料全部打开、关闭
===========以上是解释===========
因为要做到这种打开关闭的动作
所以我想说使用toggle
我原先作法是
html:
<label onclick="ctl('aa')">行政处</label>
<tr id="aa1">
<td>行政处的对应资料</td>
</tr>
javascript:
function ctl(num)
{
$("tr[id*="+num+"]").toggle();
}
但我想要把第一次按下跟第二次暗下的动作
分别再加入事件
所以才会上网找了范例(PO在版上的那个)
但范例的触发是写在ready function里
而我是希望可以分别写在物件的onclick去呼叫function
因为无法预先知道会有几层以及共有几种类别@@
想请问
有比较好的作法吗~"~
http://ppt.cc/w_OD
上面网址是我想要做到的示意图
按下"行政部"之後
会跑出他相关的资料
再按一下"行政处"
则是缩起来
按下"文学院"
跑出"中国文学系""历史学系"
按下"历史学系" 跑出相对应资料
其余的同理@@
然後按下旁边菱形的图案
则是将所属的所有资料全部打开、关闭
===========以上是解释===========
因为要做到这种打开关闭的动作
所以我想说使用toggle
我原先作法是
html:
<label onclick="ctl('aa')">行政处</label>
<tr id="aa1">
<td>行政处的对应资料</td>
</tr>
javascript:
function ctl(num)
{
$("tr[id*="+num+"]").toggle();
}
但我想要把第一次按下跟第二次暗下的动作
分别再加入事件
所以才会上网找了范例(PO在版上的那个)
但范例的触发是写在ready function里
而我是希望可以分别写在物件的onclick去呼叫function
因为无法预先知道会有几层以及共有几种类别@@
想请问
有比较好的作法吗~"~
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 210.242.153.42
1F:推 chrisQQ:用 ul li,然後 $(this).children("ul").toggle() 之类的 02/09 15:43