jQuery可以使用多个tbody进行排序

Question

我有一张桌子有多个tbody.如何为每个标题创建标题tbody？这是怎么做的？我使用jquery ui sortable.我怎样才能确定每个标题都tbody不可排序？现在我正在触发排序 $("#sortable > tbody").sortable({});.

<table>
    <thead>
        <tr>
            <th>Col1</th>
            <th>Quantity</th>
        <tr>
    </thead>
    <tbody>
        <tr>
            <th scope="rowgroup">Col1</th>
            <th>100</th>
        <tr>
        <tr>
            <td>Col1</td>
            <td>20</td>
        <tr>
        <tr>
            <td>Col1</td>
            <td>30</td>
        <tr>
        <tr>
            <td>Col1</td>
            <td>50</td>
        <tr>
    </tbody>
    <tbody>
        <tr>
            <th scope="rowgroup">Col1</th>
            <th>100</th>
        <tr>
        <tr>
            <td>Col1</td>
            <td>20</td>
        <tr>
        <tr>
            <td>Col1</td>
            <td>30</td>
        <tr>
        <tr>
            <td>Col1</td>
            <td>50</td>
        <tr>
    </tbody>
</table>

Answer 1

有趣的结构,你到那里.

我假设您希望行<tbody>分别仅在它们自己的行中排序,不包括包含<th>元素的行.

幸运的是,jQuery有 :has()

$("#sortable > tbody").sortable({
    items: 'tr:has(td)'
});

或者tr:not(:has(th)),但似乎效率较低(只是一个猜测)

演示:http://jsfiddle.net/terryyounghk/Bs2jV/

参考:http://api.jquery.com/has-selector/

此外,您可以添加connectWith: 'tbody',以防万一您想要表中的droppable任何行<tbody>.

如:

$("#sortable > tbody").sortable({
    items: 'tr:has(td)',
    connectWith: 'tbody'
});

请评论您追求的结果.谢谢.