IE中表的jQuery UI性能问题

我很难让UI代码在IE中运行良好

我有一张表——一个价值矩阵。每个单元格可以为空，也可以包含项目列表

我希望用户能够在单元格之间拖动项目

所以我的HTML看起来像这样：

<table>
    <tr><td></td><th scope="col">col 1</th><th scope="col">col 2</th></tr>
    <tr><th scope="row">row 1</th>
        <td class="droppable-cell">
            <div class="draggable-item">item A</div>
            <div class="draggable-item">item B</div>
        </td>
        <td class="droppable-cell"></td>
    </tr>
    <tr><th scope="row">row 2</th>
        <td class="droppable-cell"></td>
        <td class="droppable-cell">
            <div class="draggable-item">item C</div>
            <div class="draggable-item">item D</div>
        </td>
    </tr>
</table>

请注意，这是简化、截断和未完成的代码

我的问题是，在FX、Safari、Chrome等（即所有体面的浏览器）中，这一切都很好

不过我真的很挣扎。对于5x5表，IE在开始拖动时的延迟是明显的。在一个可能有100个项目的10x10表格上，拖动的开始会挂起浏览器

我希望能够支持多达20x15个圆形电池，可能支持多达500个项目-这是不可能的吗？看起来不应该这样

---

我做错什么了吗？在IE中，有没有一种方法可以不让页面像这样变慢？

正是因为这个问题，iGoogle和其他simliar应用程序使用了一个边缘有虚线的透明框。IE无法拖动完整的对象，因为您已概述了上述问题。

可能是表格渲染。。。你能不带桌子试试吗

如果单元格大小相同，则可以实现类似表格的浮动显示：

<style>
.droppable-cell{
  float:left; width: 50%; height: 20px; border: 1px solid black;
}
</style>

<div class="droppable-cell">
        <div class="draggable-item">item A</div>
        <div class="draggable-item">item B</div>
</div>
<div class="droppable-cell"></div>
<div class="droppable-cell"></div>
<div class="droppable-cell">
        <div class="draggable-item">item C</div>
        <div class="draggable-item">item D</div>
</div>

.可升降电池{
浮动：左侧；宽度：50%；高度：20px；边框：1px纯黑；
}
项目A
B项
项目C
项目D

---

如果必须使用表，则将样式设置为“固定”并指定单元格大小可能会有所帮助。

缩小jQuery必须搜索的DOM部分可能会有所帮助。向包含的DOM元素添加id

<table id="myTable">

---

我的解决方法是从可拖放定义中删除“activeClass”，并且只使用“hoverClass”

---

在一个大约有150行和10列的表上。它从10秒的滞后变为不到1秒。拖动会变得有点急促，但并非无法使用。

你的意思是？即使在IE中，该页面也会拖拽实际内容。我只是想拖动一些小的div。谢谢，这是个好主意——但这确实是表格数据。行标题和列标题是带有跨距的层次结构。我也不认为我可以修改单元格大小。根据文档，我以为这是$（“#myTable，.draggable item”）。@Jay。不，我指的是“祖先-后代”选择器（）。逗号可能是一个“n”选择器（），在某些情况下很有用，但这不是一个有点帮助的选择器，尽管它的改进速度仍然非常慢。主要问题似乎是ie的渲染速度非常慢。我看着它以100%的速度运行其中一个cpu，以呈现一个包含56列和34行的表，持续7分钟半。拖放花费了整整30秒的时间来启动和停止。在所有这些单元格中，只有80多个除法需要拖拽。我也有这个确切的问题。大表，表中嵌套的div。firefox在10秒内呈现页面，即等待2分钟后呈现表格。firefox仍然使用拖拽和dtop，即爬行。。事实上，它会冻结，并且拖放SDO不起作用。我将尝试下面的一些解决方案。固定宽度和#id标记名.class引用。但我确实担心它仍然会很慢。如果其他人有一些好的i-dea，我会全神贯注。是的-我的解决方案是限制IE用户-他们只能选择FX和Chrome用户可以选择的一小部分行和列。即便如此，IE8也只能处理25个电池（5x5网格），7个和6个仍然没有希望。它唤起了人们对90年代后期网络开发的回忆，这是一件丑陋的事情，但如果他们的浏览器如此糟糕，你还能做什么呢？同样的问题，IE在大网格上运行速度非常慢，但Chrome和Firefox都很好。

<table id="myTable">

$j('#myTable .draggable-item').each(function() { ...