问Javascript/Jquery:查找可排序/可拖动项的拖放位置？

EN

var origin = null;
var newItem = null;
$("#wordBank,.words").draggable({
    helper: "clone",
    connectToSortable: ".sort",
    drag: function getParent() {
        origin = $(this).parent()[0].id;
        console.log("origin = " + origin);
        return (origin);
    
    }
});
$(".words,.sort").sortable({
  connectWith: "#wordBank,.sort",
  change(event,ui)
  {
    //var sender = ui.sender[0].id;
    //console.log("SNEDER = " + sender);
  },
  beforeStop: function(event,ui) {
    newItem = ui.item[0];
    
  },
  receive: function (event, ui) {
    var sendingID = $(this).closest("ul").attr("id");
    console.log("OKOK " + sendingID);    
      ui.item.toggleClass("highlight");
      var currentListID = this.id; //where the item is dropped
      var originatedID = origin; //where item came from
      var itemID = ui.item[0].id;
      var itemContent = ui.item[0].innerHTML; //which item it is (or . 
      //ui.item[0].id)
      var currentListLength = this.children.length;

    //console.log(typeof itemContent);
    $(newItem).attr("id",itemContent);
    
    //console.log(this);
    //alert(ui.helper.attr("value"));


    
      //if current item is dropped in the word bank, remove the list-
      //inline-item
      console.log(currentListID);

      if (!ui.item[0].classList.contains("list-inline-item"))
      {
          console.log("ko");
          ui.item[0].classList.add("list-inline-item");
      }
  
      //console.log(originatedID==="wordBank");
      //console.log(originatedID!=="wordBank" && currentListID 
      //==="trash");
      if (originatedID === "wordBank")
      {
          if (currentListID === "trash")
          {
              ui.helper[0].remove();
          }
          else 
          {
              //console.log("originalID CSS = " + originatedID);
             // ui.helper.css("font-size","10px");
          }
      }
      else if (originatedID !== "wordBank" && currentListID === 
      //"trash")
      {
          ui.item[0].remove();
      }

      console.log(currentListID==="trash" && originatedID==="wordBank")
      if ((currentListID === "trash") && (originatedID === "wordBank"))
      {
          //alert("inHere");
        //console.log(ui.helper.remove());
       // console.log("Now testing the removal: ");
        //works when directly from wordBank
        ui.helper[0].remove();
    }
  }
});
$().disableSelection();

.border {
border: 1px black solid;
}

#wordBank {
border: 2px pink solid
}

<ul id="wordBank" class="bank1" value = "ok">
	<li id="1" value = "word1" class="words word1">Word1</li>
	<li id="2" value = "word2" class="words word2">Word2</li>
	<li id="3" value = "word3" class="words word3">Word3</li>
	<li id="4" value = "word4" class="words word4">Word4</li>
	<li id="5" value = "word5" class="words word5">Word5</li>
</ul>

<div  id="drop1" class="border sort">1. </div>
<div id="drop2" class="border sort">2. </div>
<div id="drop3" class="border sort">3. </div>
<div id="drop4" class="border sort">4. </div>
<div id="trash" class="border sort">5.  Trash Here </div>