我正在使用 Jquery 的 Draggable/Droppable 功能来允许从 TreeView 拖放到简单的 HTML 表,但我发现随着表中单元格数量的增加,Droppable 性能变得非常缓慢。
我环顾四周,人们建议的最常见的解决方案是限制活动的可拖动和可放置的数量。现在,限制可拖动对象非常简单(使用树视图节点的鼠标悬停来启用拖动)。
然后我尝试对 droppable 执行相同的操作(即,仅当用户将鼠标悬停在单元格上时才将其设为 Droppable),但遇到了计时问题。
基本上发生的情况是,用户将一个节点拖到单元格上并且不能放下它。但是当我再次尝试这样做时,它起作用了!换句话说,mouseover 事件需要在它起作用之前完成,但“完成它”意味着停止你的第一次拖放,这显然远非理想。
这是我正在使用的代码:
<table id="taskTable">
<tbody>
<tr>
<td class="taskTableHourCell">6:00</td>
<td class='aCell'></td> <!-- this is the cell to be dragged on, is actually created dynamically, see below -->
</tr>
</tbody>
</table>
<script type="text/javascript">
function addCell()
{
var newCell = $("<td class='aCell'></td>");
newCell.mouseover(function(){$(this).droppable({ drop: onDrop, hoverClass: "ui-state-active", addClasses: false });});
// Add the cell to the table, code not really relevant here
}
</script>
显然 addCell() 会为每个动态添加到表格中的新单元格调用(在页面加载或表格调整大小时)。
有没有解决的办法?如果 Javascript 有类似“beginmouseover”事件的东西,这会容易得多......