2

我有一个可排序的，其中两个连续的元素可以相互“附加”。执行附加操作时，我将两个“字段”元素包装在“字段组容器”div 中，希望能够将两个内部“字段”元素作为一个单元拖动。

奇怪的是，如果我从字段组容器的第一个孩子（两个孩子）开始拖动，这种方法非常有效，但是，如果我从第二个孩子开始拖动，该字段将被拉出字段组-容器。无论单击哪个元素启动拖动，我都希望两个字段元素一起移动。

我尝试使“项目”可排序选项更具体，只允许拖动字段组容器和不是字段组容器子级的字段，但看起来点击事件在冒泡到字段之前被取消 -组容器。

为了确定这是否是可排序的问题或我的实现问题，我创建了一个简化版本，看看我是否可以复制我的问题。

<div id="sortable">
    <div class="field">A</div>
    <div class="field">B</div>
    <div class="field-group-container">
        <div class="field">C</div>
        <div class="field">D</div>
    </div>
    <div class="field">E</div>
    <div class="field">F</div>
    <div class="field">G</div>
</div>

http://jsfiddle.net/prsGz/

它完全按预期工作！

这与我在项目中观察到的行为相矛盾。在我的实际实现中，“字段”元素有几个内部元素，例如标签、按钮等。

我的问题

  1. 有谁知道会导致这种行为的原因是什么？
  2. 是什么导致我的两个字段元素即使都包装在父容器中也不能作为一个单元移动？
4

0 回答 0