获取组件的Drop Target

get Drop Target of component

本文关键字:Target Drop 组件 获取      更新时间:2023-09-26

嗨,我想在Drop事件后获得Drop目标className/ID。

<div class="drop_1" id="drop1"></div>
<div class="drop_2" id="drop2"></div>
<div class="drop_3" id="drop3"></div>

所有DIV组件必须是可拖动的&

使用this。drop处理程序中的Id

jsFiddle演示
$( ".selector" ).droppable({
   drop: function(event, ui) {
       console.log(this.id);
   }
});

示例

$(function() {
      ***/* Make draggable */***
        $(".drop_1, .drop_2, .drop_3").draggable();
        var dropOpts = {
        accept:".drop_1, .drop_2, .drop_3",
        drop:dropCallback,
        greedy:true
          };
    /* Droppable */
    $(".drop_1, .drop_2, .drop_3").droppable(dropOpts);
    /*get your Drop target*/
     function dropCallback(e) {
        alert("The firing droppable was " + e.target.className);
        }
    });