javascript - 获取可拖动后面的每个 div 的 id

Question

我有以下jsfiddle .

我有一个可拖动区域，分为五个子区域，每个子区域都有其相应的 id。重点是，当可拖动对象位于每个子区域上方时，我想检索每个子区域的 id，并打印出结果。但我无法做到这一点，因为我使用的是 Javascript 的 onmouseover 方法，并且在拖动它时，鼠标始终指向可拖动对象，而不是直接指向子区域。

这是代码:

HTML

<div class="draggable ui-widget-content" id="barra_draggable">

    <div id="draggable5" class="ui-widget-header"></div>
    <div class="franja_exp" onmouseover="printid(this);" id="five_years"></div>
    <div class="franja_exp" onmouseover="printid(this);" id="four_years"></div>
    <div class="franja_exp" onmouseover="printid(this);" id="three_years"></div>
    <div class="franja_exp" onmouseover="printid(this);" id="two_years"></div>
    <div class="franja_exp" onmouseover="printid(this);" id="one_year"></div>
</div>

<div id="resultado"></div>

Javascript

var resultado = document.getElementById("resultado");

function printid (elm){
    resultado.innerHTML = "" + elm.id;
}

$("#draggable5").draggable({ containment: "parent" });

这里可以做什么来检索 ID？

Answer 1

您需要使其他元素“可删除”...这样您就可以通过 over 函数获取 id:

$(".franja_exp").droppable({over:function(event,ui){
    resultado.innerHTML = "" + this.id;
    //or: printid(this);
}});

在你的 fiddle 中: http://jsfiddle.net/m6WUT/11/