Question

我使用了来自threedupmedia的jquery Drag＆＃39; n＆＃39; Drop Plugin。我已经完全控制了拖放到dropzone。现在我有很多这些dropzones，我想检测元素被丢入哪个dropzone。但我无法找到任何方法。

您可以在fiddle

中查看用例和简化标记

jQuery(function ($) {

    $('.dnd-btn')
        .drag("start", function (ev, dd) {
    })
        .drag("end", function (ev, dd) {
        if (!$(this).hasClass('dropped')) {
            $(this).css({
                top: dd.originalY,
                left: dd.originalX
            });
        } else {
            $(this).removeClass('dropped');
        }
    })
        .drag(function (ev, dd) {
        $(this).css({
            top: dd.offsetY,
            left: dd.offsetX
        });
    }, {
        relative: true,
        drop: '.dnd-drop'
    });

    $('.dnd-drop').drop(function (ev, dd) {
        console.log(ev);
        // fade out element and show it again at origin position:
        $(dd.drag).addClass('dropped').fadeOut('slow',

        function () {
            $(dd.drag).css({
                top: dd.originalY,
                left: dd.originalX
            }).fadeIn();
            $('.balance').parent().removeClass('highlight');
        });

        // update account value local
        var price =  parseFloat(  $(dd.drag).data('price') ).toFixed(2);
        console.log(price);
        balance = $('.balance');
        var accountVal = parseFloat(balance.text());
        accountVal = accountVal - price;
        balance.text(accountVal.toFixed(2));

    });
});

Answer 1

好吧我用旧的尝试和错误算法想出来了。它像烤蛋糕一样简单：只需在drop事件中使用$（dd.drop）来获取当前删除的元素。

$('.dnd-drop').drop(function(ev, dd){
       $(dd.drop).text("I'm the one you searched for!");
});

Drag n Drop：如何检测丢弃的元素-jquery，threedupmedia

1 个答案: