作者eviliori (穿着88s的恶魔)
看板Ajax
标题[问题] 用JQuery搜寻类似树状结构的问题
时间Fri Jun 5 22:04:03 2009
目前着手将一个表单搜寻功能由server查询改成client端查询
以求减少server端的loading，但有个地方不知道怎麽改才好，
烦请板上有兴趣的大大帮忙解解看。
以下是html部分：
<DIV id="myProj">
<table cellpadding='1' cellspacing='2' BGCOLOR="#C1FBBD">
<TR><TD colspan=4>
搜寻专案：<input type=text id=search>
<input type=button id=btnSearch value="查询">
</TD></TR>
</table>
<HR>
<table id='ProjList' cellpadding='1' cellspacing='2' BGCOLOR="#C1FBBD">
<TR><TD colspan=4><font color=red>----最近的专案----</font></TD></TR>
<TR>
<td><input type=button value='IA52005080002' name='文件系统
建置' class="btnProj1">
</td>
<td bgcolor='#e7e7e7'>文件系统建置</td>
</TR>
<TR><TD colspan=4><font color=red>----部门专案----</font></TD></TR>
<TR>
<td><input type=button value='AA50200000001' name='部门事务'
class="btnProj1"></td>
<td bgcolor='#e7e7e7'>部门事务</td>
</TR>
<TR>
<td><input type=button value='AA50200000002' name='教育训练'
class="btnProj1"></td>
<td bgcolor='#e7e7e7'>教育训练</td>
</TR>
<TR>
<td><input type=button value='IA52005080004' class="btnProj2"></td>
<td bgcolor='#e7e7e7'>母专案</td>
</TR><TR><TD colspan=4>
<TABLE border=0 cellpadding=1 cellspacing=2 class="SubTab">
<TR>
<td width=80> </td>
<td><input type=button value='子专案1' class="btnSubProj"></td>
<td bgcolor='#e7e7e7'>AAAAA</td>
</TR>
<TR>
<td width=80> </td>
<td><input type=button value='子专案2' class="btnSubProj"></td>
<td bgcolor='#e7e7e7'>BBBBB</td>
</TR>
<TR>
<td width=80> </td>
<td><input type=button value='其他' class="btnSubProj"></td>
<td bgcolor='#e7e7e7'>其它</td>
</TR>
</TABLE>
</table>
</DIV>
<!-- JQuery script -->
<script>
$(function(){
$('table [class="SubTab"]').hide();
$(':button[class="btnProj2"]').click(function(event) {
if(this == event.target){
$(this).parent().parent().next().children()
.children().toggle();
}
});
$('
#btnSearch').click(function() {
$("
#ProjList tr").hide()
.filter(":contains('----')").show()
.end().filter(":contains('" + $('#search').val() + "')").show()
.end().filter(":has(input:button[value*='" + $('#search').val()
+"'])").show();
});
});
</script>
目前遇到的问题在於无论是button value或是 td里的值我都可以搜寻到，
但是原来母专案这个按钮按下後有子专案会显示，未搜寻前按钮正常
搜寻之後，如果母专案有被搜寻到，按下後子专案应该可显示的部份有问题
会没反应。
我想是搜寻之後DOM的结构已经不同所以母专案的按钮才会失效。
有没有搜寻之後，母专案按钮功能仍正常的写法呢？
想了很久但仍不得其解 = =||||
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 59.115.161.48
※ 编辑: eviliori 来自: 59.115.161.48 (06/05 22:12)
1F：→ TonyQ:看起来粗浅像是live binding 的问题 , 但是说真的我看不太懂 06/07 03:04
2F：→ TonyQ:确实的问题. 搜寻是怎麽个搜寻法 o_o 06/07 03:04
3F：→ eviliori:也许是我描述的不好，但把code贴成html加上jQuery.js 06/11 00:15
4F：→ eviliori:去跑应该可以知道问题 06/11 00:15
5F：→ eviliori:结果在 $('#btnSearch').click 里加上把子专案的那一行过 06/11 00:16
6F：→ eviliori:滤就可以了 show()的用法只是把该选择的集合恢复原样 06/11 00:17
7F：→ eviliori:之前没把show()这用法搞懂～ 06/11 00:18