如何访问被放入可排序的draggable元素的id

Question

我正在使用JQuery库来实现拖放.

当它被放入可排序列表时,如何获取被拖动的元素？

我想得到被拖动的div的id.拖动以下元素:

<div class="control" id="control[1]" >
  <img src="img/controls/textfield.png" />
</div>

我有他们的例子中的标准拖动功能

$(".control").draggable({
  connectToSortable: '#sortable',
  helper: 'clone'
});

拖动部分中的函数停止,下一个代码返回正确的值

stop: function(event, ui) {
  alert(ui.helper.attr('id'));
}

这是可排序的元素:

<ul id="sortable"><li>test</li></ul>

和他的功能:

$("#sortable").sortable({
  revert: true,
  accept: '.control',
  receive: function(event, ui) { 
    // here i need to get draggable element id
  }
});

我尝试了各种ui.id等似乎不起作用.

receive: function(event, ui) { 
  $(ui.draggable).attr("id")
}

抛出undefined.

---

更新:

对不起,我的错:)我母亲常说 - "编码前读取API".ui.item.attr('id')工作良好.

Answer 1

尝试

receive: function(event, ui) { 
  $(ui.item).attr("id")
}

根据文档,receive(实际上所有可排序的回调)都有两个参数.第二个参数应包含:

• ui.helper - 当前的帮助元素(通常是项目的克隆)
• ui.position - 助手的当前位置
• ui.offset - 帮助程序的当前绝对位置
• ui.item - 当前拖动的元素
• ui.placeholder - 占位符(如果您定义了一个)
• ui.sender - 项目来源的可排序项(仅当您从一个连接列表移动到另一个连接列表时才存在)

Answer 2

看起来contextui.item在beforeStop事件和receive事件之间发生了变化.

在我的情况下,我试图将项目的ID设置为生成的值和

receive: function (event, ui) { ui.item.attr("id", "control" + currentControlId++);}

不适合我

所以你可以解决这个问题:

beforeStop: function (event, ui) { itemContext = ui.item.context;},
receive: function (event, ui) { $(itemContext).attr("id", "control" + currentControlId++);}