jquery-ui - Jquery draggable droppable with table

Question

嘿，我正在使用 Jquery draggable droppable with table 我已经初始化了两者及其工作，但问题是可放置区域是表，当我尝试将它显示的项目放在表格下方时，放置项目在 div 中，我想要放置它的行 ID 但我得到的是整个表

代码如下

表格的JavaScript代码

$(function() {
    $( "#draggable" ).draggable({ axis: "y" });

    $( "#droppable" ).droppable({ 
        drop: function(event, ui) { 
            console.log($(this).find('tr.pen'))
            $(this).append($(ui.draggable));
        }
    });
});

表格代码非常大，如果您能帮忙，请告诉我，我很乐意将代码发送给您

我愿意接受任何建议

谢谢。

Answer 1

如果您想将可拖动对象放在单独的行上，那么不要在整个表格上实例化可拖动对象，而是在 <tr> 上实例化表的。检查此代码是否适合您:

$(function() {
    $( "#draggable" ).draggable({ axis: "y" });

    $( "#droppable tr" ).droppable({ 
        drop: function(event, ui) { 
            $(this).append($(ui.draggable));
        }
    });
});