在iframe中，jQuery UI可拖动的元素是什么

这是我的代码，在这里我试图检测元素，jqueryui

draggable

正在其上悬停。我需要获取元素的对象和属性，例如类名（在本例中为

.sortable grid

，

.sortable table

，

.sortable row

，

.sortable cell

）

这里的答案只显示了如何获取可拖动项本身（

ui.helper

或

event.target

），而不是它悬停在上面的元素

最好的回答方法是使用准备好的JSFIDLE，因为我的代码使用iframe，如果完整的代码发布在这里，它将不起作用：

HTML:

---

可以通过修改另一个函数来满足此目的。调整它以使用

iframe

的

contentWindow

并添加

offset

计算后，它现在可以工作了

来自PointiFrame（x，y，offsetX，offsetY）的函数等位基因{
var元素，元素=[]；
var old_可见性=[]；
while（true）{
element=document.getElementById（'frame'）.contentWindow.document.elementFromPoint（x-offsetX，y-offsetY）；
if（！element | | element==document.getElementById（'frame'）.contentWindow.document.documentElement）{
打破
}
元素。推（元素）；
old_visibility.push（元素、样式、可见性）；
element.style.visibility='hidden'；//临时隐藏元素（不更改布局）
}
对于（var k=0；k

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0-beta.1/jquery-ui.js"></script>

<div style="background-color:grey;display:inline;cursor:move" id="draggable">DRAG ME</div>
<iframe src="https://fiddle.jshell.net/piglin/UAcC7/1869/show/" id="frame" style="width:100%;overflow:visible" seamless="seamless" scrolling="no"></iframe>

$("#draggable").draggable({
    drag: function(event, ui) {
        //Some code here
    }
}

function allElementsFromPointIframe(x, y, offsetX, offsetY) {
  var element, elements = [];
  var old_visibility = [];
  while (true) {
    element = document.getElementById('frame').contentWindow.document.elementFromPoint(x - offsetX, y - offsetY);
    if (!element || element === document.getElementById('frame').contentWindow.document.documentElement) {
      break;
    }
    elements.push(element);
    old_visibility.push(element.style.visibility);
    element.style.visibility = 'hidden'; // Temporarily hide the element (without changing the layout)
  }
  for (var k = 0; k < elements.length; k++) {
    elements[k].style.visibility = old_visibility[k];
  }
  elements.reverse();
  return elements;
}

var selected = $('');
var tmpColor = 'transparent';
$("#draggable").draggable({
  drag: function(event, ui) {
    var el = $(allElementsFromPointIframe(event.pageX, event.pageY, $(frame).offset().left, $(frame).offset().top));
    var div = $(el).filter('ul, li').not($(this));
    selected.css({'backgroundColor': tmpColor});
    selected = div.last()
    tmpColor = selected.css('backgroundColor');
    selected.css({'backgroundColor': 'red'});
    console.dir(div);
  },
  iframeFix: true,
  iframeOffset: $('#iframe').offset()
});