可使用jQueryUI在滚动区域中拖动

我有一个

Draggable

和

Sortable

区域，我的Draggable区域有滚动条，当我尝试将项目从Draggable拖动到Sortable时，第一个滚动区域滚动，这不好，第二个拖动项目时，我在光标周围看不到拖动的项目。有关更多信息，我尝试创建一个a，因此我的问题是：

从可拖动区域拖动时，不应滚动

请参见光标周围的拖动项

---

您应该为所有元素指定宽度和高度，以防止出现奇怪的行为。没有它，Sortable无法正常工作。要禁用滚动条，请使用溢出：隐藏。使用列表样式type:none来显示项目符号点也很好，并为拖拽表提供背景色，以便更好地查看它们。 使用as容器而不是封装。这是通常的方式。。。以及预防问题的方法

您使用的draggable（）、dropable（）和sortable（）都是混合使用的，但对于您的情况，您实际上只需要sortable（）

HTML

 <ul class="draggableContainer connectedSortable">
      <li>Item 1</li>
      <li>Item 2</li>
       <li>Item 3</li>
      <li>Item 4</li>
       <li>Item 5</li>
      <li>Item 6</li>
    </ul>

    <ul class="droppableContainer connectedSortable">
      <li>Test</li>
    </ul>

CSS

$('.draggableContainer, .droppableContainer').sortable({
  connectWith:'.connectedSortable',
  cursor: "move", cursorAt: { top: 10, left: 60 },
  zIndex:999
}).disableSelection();

.droppableContainer{
  z-index:0;
}
.droppable, draggable{
  z-index:1000;
}

ul {
    padding:5px;
    overflow:hidden;
}
ul li {
  list-style-type: none;
      width:100px;
      height:20px;
      margin-bottom:2px;
      background-color:silver
}

.draggableContainer, .droppableContainer{
  background-color:gray;
  width:120px;
  height:200px;
  overflow-x:hidden;
  margin:0;
  display:inline-block;
}
.droppableContainer{
  background-color:violet;

}

---

@姆贝特玛：它对你有用吗？