作者fr730149 ()
看板Ajax
標題Re: [問題] JQuery合併td
時間Fri Sep 23 09:44:08 2011
的確是蠻利害的解法，依小弟的程度還寫不出來，需要好好消化一下
: http://jsbin.com/oveger/edit#source
: // 從第一個row逆向走訪每一個cell
: $($('tr:first td').get().reverse()).each(function(index){
: // $start為比對目標，指向每一組的首項cell
: var $start = $current = $(this);
: var $next;
: var need_remove = $([]);
: // 逆向所以index要算一下
: index = $start.parent().children().length - index - 1;
: // 取得同一個column的下一個cell
: while(($next=$current.parent().next().children().eq(index)).length){
: if($start.html() == $next.html()){
: var rs = (parseInt($start.attr('rowspan'), 10) || 1) + 1;
: $start.attr('rowspan', rs);
: need_remove.push($next);
: }
: else{
: $start = $next;
: }
: $current = $next;
: }
: // 每跑完一個column才移除不要的cell
: need_remove.each(function(){
: this.remove();
: });
: });
: 設rowspan和移除多餘的cell的部分
: 或許可以有更好的寫法
附帶一提，將以上的語法套用以下的html，編輯欄位下的值就無法完全合併…
<table border class="tbspan">
<thead>
<tr>
<th scope="col">帳號</th>
<th scope="col">姓名</th>
<th scope="col">編輯</th>
</tr>
</thead>
<tbody>
<tr class="tbspan">
<td class="Style1">A001</td>
<td class="Style1">素還真</td>
<td class="Style1"><a href="/Home/Edit/A001?target=_blank">編輯</a></td>
</tr>
<tr>
<td class="Style1">A001</td>
<td class="Style1">葉小釵</td>
<td class="Style1"><a href="/Home/Edit/A001?target=_blank">編輯</a></td>
</tr>
<tr class="tbspan">
<td class="Style1">A003</td>
<td class="Style1">劍子仙跡</td>
<td class="Style1"><a href="/Home/Edit/A003?target=_blank">編輯</a></td>
</tr>
<tr>
<td class="Style1">A005</td><td class="Style1">佛劍分說</td>
<td class="Style1"><a href="/Home/Edit/A005?target=_blank">編輯</a></td>
</tr>
<tr class="tbspan">
<td class="Style1">A005</td>
<td class="Style1">佛劍分說</td>
<td class="Style1"><a href="/Home/Edit/A005?target=_blank">編輯</a></td>
</tr>
</tbody>
</table>
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 140.125.235.184
1F：推 No:可能中間多個tbody吧~我寫的沒去處理tbody那一層 09/23 09:56
2F：推 No:噢~還有thead 09/23 10:08
3F：推 No:另外第一層tr裡是th的話，程式碼也需要修改為 $('tr:first th') 09/23 10:13
4F：推 No:啊~ 以這個html來看的話，可以直接改 $('tr:eq(1) td') 09/23 10:18
5F：→ No:thead的部分不需要合併的話，直接從tbody內容開始run就可以 09/23 10:18
6F：→ fr730149:我用$($('tbody tr:first td').開始跑，其結果未完全合併 09/23 10:57
7F：→ fr730149:將if($start.html() == $next.html())中的html()改成 09/23 10:58
8F：→ fr730149:text() 就可以了，目前尚未發現bug。原因尚待查… 09/23 10:59
9F：推 No:你編輯的超連結路徑不一樣，用text()來判斷合併不會有問題嗎? 09/23 11:04
10F：→ fr730149:喔~對哦 我忽略了連結不同 難怪它不給合 謝謝解答 09/23 11:10