Interfaccia utente jQuery, come ottenere l'id dell'elemento dove rilasciare l'elemento?

Question

il mio codice è qui sotto:

quando ho goccia elementi LI elemento arco contenuto del div, al momento voglio ottenere id come possibile di tag span?

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

È possibile controllare l'elemento che riceve il calo controllando event.target nel drop event.

I parametri evento e ui contengono alcune informazioni sugli elementi di trascinamento della selezione.

È possibile ottenere l'id dell'elemento che ricevono la goccia con: $(event.target).attr('id')

Ecco un violino di lavoro: http://jsfiddle.net/IrvinDominin/Pf4P9/1/