Giao diện người dùng jQuery, cách lấy id phần tử trong đó thả phần tử?

Question

Mã của tôi là bên dưới:

khi tôi thả các mục li trong phần tử span của div nội dung, tại thời điểm tôi muốn có id của thẻ span làm thế nào nó có thể?

jsfiddle link

<ul class="secd_line_icon" id="secd_line_icon" > 
    <li id="products"> 
     <img id="productid_1" class="product" src="https://si0.twimg.com/profile_images/1888289249/heart_sm_normal.jpg" /> 
    </li> 
</ul> 


<ul id="bookmark_icon" class="droppable" style="height: 100px;"> 

</ul> 

<div id="content" > 
    <span id="s1">I have two hearts 
Heart is pulsating with blood <span> 

<span id="s2"> And heart is pulsating with love 
     </span> 
</div> 

<script> 
    $("#content").droppable({ 
     accept: '#secd_line_icon li', 
     drop: function(event, ui) { 

      $("#bookmark_icon").append($(ui.draggable).clone()); 
      $("#content_area .product").addClass("item"); 
      $(".item").removeClass("ui-draggable product"); 
      $(".item").draggable({ 
       containment: 'parent', 
       grid: [150,150] 
      }); 
     } 
    }); 
    $("#secd_line_icon li").draggable({ 
     helper: 'clone' 
    }); 

</script> 

Answer 1

Bạn có thể kiểm tra các yếu tố đó được thả bằng cách kiểm tra event.target trong drop event.

Thông số sự kiện và tham số ui chứa một số thông tin về các yếu tố kéo và thả.

Bạn có thể lấy id của phần tử đó nhận được thả với: $(event.target).attr('id')

Đây là một fiddle làm việc: http://jsfiddle.net/IrvinDominin/Pf4P9/1/