使用带有 <thead> 标签的 Jquery 从 html table 拖放多行

Question

我在 JsFiddle 中有两个表，我想在它们之间交换行 <tr>。我希望能够使用 Jquery 执行此操作，但是现在，由于 <thead> 标记，它无法正常工作。我认为它与 selector 中的 items 有关，但我不知道将其更改为什么以便忽略 <thead>。我想知道如何编辑代码，以便它可以使除 <thead> 标签

之外的所有内容都可拖动和重新排列

JsFiddle

在当前的 jsfiddle 中，删除 <thead> 标签会起作用，但是我需要 <thead> 在那里

Answer 1

请修复您的 HTML 代码。您必须将 "thead" 标记放在 "tbody" 之外 它会起作用。还有一件事，您不需要将 droppable 与 sortable 一起使用，将其删除。 http://jsfiddle.net/73kv2vm9/1/

的工作版本

            <table id='table-draggable1'>  
            <thead>
                <tr>
                    <th>col1</th>
                    <th>col2</th>  
                    <th>col3</th>  
                    <th>col4</th>  
                </tr>
                </thead>
            <tbody class="connectedSortable"> 
                <tr>   
                    <td>156</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td>  
                    <td>1.82</td>                                                                  
                </tr>  
                <tr>  
                    <td>256</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td> 
                    <td>1.82</td>                                                                
                </tr>  
            </tbody> 
        </table>
        <table id='table-draggable2'>  
            <thead>
                <tr>
                    <th>COL1</th>  
                    <th>COL2</th>  
                    <th>COL3</th>  
                    <th>COL4</th>  
                </tr>
                </thead>
            <tbody class="connectedSortable">
                <tr>   
                    <td>356</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td>  
                    <td>1.82</td>                                                                  
                </tr>  
                <tr>  
                    <td>456</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td> 
                    <td>1.82</td>                                                                
                </tr>  
            </tbody> 
        </table>