如何將可拖動元素單獨附加到多個可放置的div

Question

我的draggable元素有一個小問題，它附加到多個droppable div。 我想制作代碼，以便我可以附加到任何droppable div而不會影響任何其他可丟棄的div。 我認為我所要做的只是包括我希望可以放棄div的盒子的ID，這樣就行了。

$('#sortcard, #dropbox, #dropbox1').droppable({accept:'.sorting', hoverClass:'border', tolerance: 'touch',
    drop: function (e, ui){
    $('#sortcard, #dropbox,#dropbox1').append(ui.draggable.html() + '<br/>');
    $("#add_friend").show().fadeOut(12000);
    }
    });

但是，正如在這里看到的那樣，問題是只有一個盒子被觸摸時所有的div都會受到影響。 我很想知道如何解決這個問題以及不再犯這個錯誤的知識以及任何其他技巧。

Answer 1

你的問題就在這里：

$('#sortcard, #dropbox,#dropbox1').append(ui.draggable.html() + '<br/>');

這意味着將它附加到所有這些元素。 也許您應該使用$(this)或$(e.target)作為選擇器。 這意味着它只會附加到被刪除的元素上。

Answer 2

用這個....這里是小提琴

http://jsfiddle.net/Kxtvg/83/

變

$('#sortcard, #dropbox,#dropbox1').append(ui.draggable.html() + '<br/>');

至

$(this).append(ui.draggable.html() + '<br/>');

你將html附加到所有提到的元素$（'＃sortcard，＃dropbox，＃dropbox1'）。 使用$（this）將僅將內容刪除到所選元素