Re: [問題] JQuery合併td

看板Ajax作者fr730149時間14年前 (2011/09/23 09:44)推噓5(5推 0噓 5→)

留言10則, 2人參與討論串6/10 (看更多)

的確是蠻利害的解法，依小弟的程度還寫不出來，需要好好消化一下 : 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