하나의 태그 'tr'을 사용하여이 그림과 같은 표를 만들 수 있습니까?

Question

I 정렬 표는 내가 위의 그림과 같이 2 개 이상의 'TR'를 사용할 수 있도록하는 경우 libray "tablesorter에 JS는"하지만, 라이브러리가 작동하지 않습니다 사용할 수 있습니다. 그래서 'tr'만 써야합니다.

만들 수 있습니까?

Answer 1

원하는 테이블 구조를 만들려면 두 개의 tr이 필요합니다.

원래 테이블러는 cssChildRow 옵션을 포함하며 기본값은 "expand-child"입니다. It isn't documented,하지만 see a demo here 수 있습니다. 여기에 a demo의 작동 방식이 나와 있습니다.하지만 두 번째 열을 정렬 할 수는 없습니다.

는 HTML

<tr> 
    <td colspan="2">Lamp</td> 
</tr> 
<tr class="expand-child"> 
    <td>Burn Time</td> 
    <td>150 Hours</td> 
</tr> 

스크립트는 내 fork of tablesorter에서

은

$(function() { 
    $('table').tablesorter({ 
    cssChildRow: "expand-child" 
    }); 
}); 

, 당신은 여전히 ​​cssChildRow option을 설정할 수 있지만 기본은 "tablesorter-childRow"로 변경되었습니다. HTML 또는 스크립트에 필요한 변경없이 하위 행의 여분의 열을 자동으로 처리합니다 (demo).