jquery ui 获取拖动元素的子元素的 id(当放置时)

发布于 2024-08-24 11:30:08 字数 611 浏览 4 评论 0原文

我已经阅读了许多关于 SO 的拖放线程,但我还没有找到一个告诉我如何在拖放元素被拖放时获取被拖放元素的子元素 id 的线程。

例如,如果你有

<div id='drag'>
  <img id="something"/>//how do i get this id when #drag is dropped?
</div>

<div id='drop'>
</div>

js

$('#drag').draggable({
  containment: '#content',
  scrollSensitivity: 60,
  revert: 'invalid',
  cursor: 'move'
});

$('#drop').droppable({
  accept: '#albumImgs li',
  activeClass: 'dropContainerOpen',
  drop: function(event, ui) {
    var fileName = $(ui.draggable.attr('alt'));
    console.log(fileName);
  }
});

I've read through many of the drag and drop threads on SO and i haven't found one that tells me how to get the child element id of the dragged element, when the dragged element is dropped.

For example if you have

<div id='drag'>
  <img id="something"/>//how do i get this id when #drag is dropped?
</div>

<div id='drop'>
</div>

and the js

$('#drag').draggable({
  containment: '#content',
  scrollSensitivity: 60,
  revert: 'invalid',
  cursor: 'move'
});

$('#drop').droppable({
  accept: '#albumImgs li',
  activeClass: 'dropContainerOpen',
  drop: function(event, ui) {
    var fileName = $(ui.draggable.attr('alt'));
    console.log(fileName);
  }
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

浅忆 2024-08-31 11:30:08

ui.draggable 是拖动的元素,您只需要对您想要的子元素进行查询即可:

$('#drop').droppable({
  accept: '#albumImgs li',
  activeClass: 'dropContainerOpen',
  drop: function(event, ui) {
    var fileName = $(ui.draggable.attr('alt'));
    console.log(ui.draggable.find('#something'))
    console.log(fileName);
  }
});

ui.draggable is the dragged element you just need to do a query for the child you want:

$('#drop').droppable({
  accept: '#albumImgs li',
  activeClass: 'dropContainerOpen',
  drop: function(event, ui) {
    var fileName = $(ui.draggable.attr('alt'));
    console.log(ui.draggable.find('#something'))
    console.log(fileName);
  }
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文