如何在同一个表中拖放多个表格单元格?

时间:2016-09-13 04:57:53

标签: javascript jquery html drag-and-drop

我想从表中拖放多个单元格,但我所指的代码仅限于单个单元格操作。但我想对多个单元格执行相同的操作。我正在使用的代码如下:

table th,table td{
    height: 30px;
    width: 200px;

}
table span{
    display:block;
    background-color: #09C;
    height: 100%;
    width: 100%;
}
<table id="#our_table"  border="1">
    <tr>
        <th>head1</th>
        <th>head1</th>
        <th>head1</th>
    </tr>
    <tr>
        <td><span class="event" id="a" draggable="true">aaa</span></td>
        <td></td>
        <td></td>
    </tr>
</table>
$(document).ready(function(){
    $('.event').on("dragstart", function (event) {
        var dt = event.originalEvent.dataTransfer;
        dt.setData('Text', $(this).attr('id'));
    });
    $('table td').on("dragenter dragover drop", function (event) {  
        event.preventDefault();
        if (event.type === 'drop') {
            var data = event.originalEvent.dataTransfer.getData('Text',$(this).attr('id'));
            de = $('#'+data).detach();
            de.appendTo($(this));   
        };
    });
})

这是fiddle

0 个答案:

没有答案