0

现在在我的 html 页面上动态生成大约 15 个不同的表，每个表中大约有 1-15 行。当用户单击某个单元格时，嵌套表会出现在下面的行中。一切看起来都很好，它做了它需要做的事情，只是从用户单击单元格打开嵌套表到嵌套表实际显示大约有 2 秒的延迟。

我能做些什么来减少时间？或者有什么办法可以缓解这种情况？

轻的例子。在实际应用程序中授予，会有更多的表/行。这个例子没有延迟，因为它纯粹是为了展示我如何设置 http://jsfiddle.net/poppypoop/ZUTXT/1/

我的 HTML

<table>
<tr>
    <td></td>
    <td class="clickme">
        <div style="display: none;">
            <table>
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </table>
         </div>
    </td>
    <td></td>
</tr>

在这个嵌套表中，我在每个单元格中为我的应用程序显示各种信息。通常，嵌套表可以有 1 行到 10 行之间的任何位置

因此，当用户单击单元格以显示嵌套表时，这里是被调用的 javascript

$(item).closest("tr").after("<tr><td></td><td colspan = '999'>" + $(item).next().html() + "</td></tr>");

注意 我使用的是 IE10 和 IE9

4

2 回答 2

1

在我看来，您正在获取按钮后面的 div 的 html 内容，然后将其插入到最近的 tr 节点之后。

dom 必须将 html 作为字符串提供给您，然后解析您返回的字符串。如果您只想显示和隐藏行，为什么不设置 .hide() 或 .show() 呢？这样就没有 dom 操作，这实际上是相当昂贵的，因为浏览器必须重新计算所有内容，以防你的新添加改变任何其他内容。CSS 更改通常更快。

如果您从其他地方获取 html，您可能希望将其视为瓶颈。尝试使用类似的东西console.log((new Date()).getTime())来分析代码中的不同点，看看问题出在哪里。

如果您可以重新创建小提琴中的延迟，这将帮助人们帮助您:)

于 2013-08-15T00:37:23.647 回答
0

事实证明，有一条线迫使它在 IE7 中呈现。一旦删除这个，表格扩展是即时的点击。

于 2013-08-15T20:19:35.877 回答