具有 y 轴限制的 jQuery 可拖动克隆

Question

如果我有这个标记：

<table id="sometable">
      <tr>
          <td class="x"><span>111</span></td>
          <td>aaa</td>
      </tr>
      <tr>
          <td class="x"><span>222</span></td>
          <td>bbb</td>
      </tr>       
</table>

还有这个 jQuery 代码：

$(".x span").draggable({ helper: 'clone', axis: 'y'});

当拖动第一列时，克隆的跨度会吸附到第二列而不是第一列。如果我尝试拖动表格单元格而不是其中的跨度，则它会在表格之外捕捉。如果我删除轴：'y' 按预期工作，但我不再有我想要的 Y 轴限制。有任何想法吗？谢谢。

Answer 1

您需要指定一个遏制和快照。

$(".x span").draggable({ 
    snap: '.x', 
    snapMode: 'inner', 
    containment: '#sometable', 
    helper: 'clone', 
    axis: 'y'
});