jQuery: kéo và thả: tìm id của mục tiêu

Question

Tôi đang phát triển một ứng dụng kéo và thả. Tôi có một DIV có thể kéo dọc theo tài liệu và có một số div khác trong tài liệu, tôi có thể kéo một div vào các div khác, nhưng làm cách nào tôi có thể tìm id của div mà tôi đã bỏ DIV kéo,

Tôi chỉ muốn biết id của DIV mục tiêu sau khi đặt một DIV khác lên đó.

Cảm ơn

Answer 1

Bạn sẽ có thể để có được ID của mục tiêu từ this.id từ bên trong các chức năng sự kiện (demo)

$(".droppable").droppable({ 
    drop: function(event, ui) { 
     $(this).addClass("ui-state-highlight").find("p").html("Dropped in " + this.id); 
    }, 
    over: function(event, ui) { 
     $('.display').html(this.id); 
    } 
}); 

Updated demo để làm cho nó rõ ràng rằng this.id tác phẩm trong bất kỳ sự kiện .

Answer 2

Nếu bạn sử dụng ủy quyền sự kiện, tuy nhiên, này sẽ là một số phụ huynh của div mục tiêu. Trong trường hợp này, bạn có thể sử dụng:

var handleDrop=function(e) 
{ 
    var target=e.target || e.srcElement; 
    var id=target.id; 
    // do something with it 
} 

Answer 3

Bạn có thể sử dụng trình xử lý sự kiện; nó cung cấp cho bạn cả một kéo và một rơi xuống.

function handleDropEvent(event, ui) { 
    alert('Dropped ' + ui.draggable.attr('id') + ' onto ' + event.target.id); 
} 

$('#someContainer').droppable({ 
    drop: handleDropEvent 
})