jquery-ui - onclick 检索所有已删除元素的绝对位置字符串

Question

在搜索了一天并尝试了一些解决方案后，没有一个对我有用。

Draggables 是内部的列表项<ul>。Droppable 在它旁边的 div 上。现在基本拖动，现在克隆没有助手。

Onclick 我想：

• 从可放置区域获取所有可拖动位置。（相对于文档的绝对位置）

  • 注意：<li>可拖动位置中的每个都有一个唯一的 ID。（可拖动列表是从 ajax 回调构建的，因此在解析 xml 时添加了 id：<li id="'+uid+'">...
  • 我希望以字符串格式检索所有位置，例如： var send_new_positions = "id1;x1,y2;id2;x2,y2"; 示例：“1;108,57”表示：li，id=1，xPos=108，yPos=57。

问题：

我不能用老式的方式 onclick 收集可拖动区域内的所有列表项，因为没有。在调试器中，我看到它们不是那样工作的，droppable 保持干净，draggables 使用内联样式更新，例如：<li style="position: relative; left: -270px; top: 127px;" class="ui-draggable dropped">...

我是否应该为可拖动对象构建一个选择器，该选择器使用“ ui-draggable dropped<li> ”类找到每个对象，然后提取位置？我认为这是更难的方法，毕竟我只得到相对位置。

我是否应该将我的逻辑添加到drop : function() 并将我的字符串格式添加到每个<li>被删除的内容中。如果是这样，我应该如何将此字符串数据附加到每个 drop <li>？

最好的方法是什么？

Answer 1

循环所有可拖动元素并构造字符串：

$('#myButton').click(function(){
    var myStringPosition = null;
    $('.ui-draggable').each(function(){
        myStringPosition = $(this)[0].id + ';' + $(this).css('left') + ';' + $(this).css('top');
    });

    alert(myStringPosition);
});