Jquery 鼠标双击时自动拖放事件

这是我的小提琴：

期望值：当我双击任何空的TD时，own TR的可拖动元素可以自动拖放到该TD

我在谷歌上搜索了很多，但没有找到完美的解决方案

我的JS代码

$(function () {
    $(".dragDiv").draggable({
        revert: 'invalid'
    });
    $(".mainTable tr td").droppable({
        accept: function (item) {
            return $(this).closest("tr").is(item.closest("tr")) && $(this).find("*").length == 0;
        },
        drop: function (event, ui) {
            console.log($(this).attr('id'));
            console.log(ui.draggable.attr('id'));
            var $this = $(this);
            $this.append(ui.draggable.css({
                top: 0,
                left: 0
            }));
            ui.draggable.position({
                my: "center",
                at: "center",
                of: $this,
                using: function (pos) {
                    $(this).animate(pos, "slow", "linear", function () {

                    });
                }
            });
        }
    });
});

---

您可以尝试以下方法：

---

太棒了，老兄，非常感谢

$('.mainTable tr td').on('dblclick',function(e) {
    if (!$(this).is(':has(.dragDiv)')) {
        var destTD = $(this);
        var srcTD = $(this).parent().find('td:has(.dragDiv)');
        var drgElement = srcTD.find('.dragDiv');
        drgElement.animate({ left: "+=" + (destTD.position().left - srcTD.position().left) }, "slow", "linear",function() {
            drgElement.appendTo(destTD);  
            drgElement.css({left: 0});              
        });
    }
});