0

我有一个带有行(20 行)的 HTML 表。每行都有一个国家列表框(大约 250 个国家/地区),这些国家/地区使用数据库中的单个数据集填充。

加载时间足够快,但渲染时间真的很乱。有什么方法可以加快这些列表框的渲染速度吗?

4

2 回答 2

1

您可以只加载一次,然后将 DOM 元素复制到您需要的任何地方...

我不确定这是否会改善很多,因为它会更多地依赖用户的计算机,但我想如果它现在的速度太慢的话,值得一试。

编辑:这就是我的做法。谨慎使用,我没有测试过,这段代码很可能有很多错误,这只是为了让你了解我在说什么。

<mylistbox id="listboxtemplate"> ... </>

<div class="thisPlaceNeedsAListbox"></div>
<div class="thisPlaceNeedsAListbox"></div>
<div class="thisPlaceNeedsAListbox"></div>

准备好文档,使用 jquery:

jQuery(".thisPlaceNeedsAListbox").append( jQuery("#listboxtemplate").clone() )
于 2010-01-05T09:42:45.137 回答
1

只有在用户选择了上一个选择框(使用 JavaScript)后,您才能尝试添加下一个选择框。

我很确定您可以重新考虑表格或流程,但是由于您没有提供足够的信息,因此我无法提出任何具体建议。例如,根据情况,您可以使用多选或一些花哨的 JavaScript 小部件。

根据您的评论进行编辑:

那么如何在没有选择的情况下为桌子服务。如果用户双击国家/地区字段,您可以使用 javascript 将文本元素更改为选择元素。一旦用户选择了国家,您就可以改回文本元素。您可以使用 Ajax(在用户选择国家后)或使用隐藏字段的提交按钮将结果提交回服务器。这样 DOM 将永远不会包含超过 1 个选择元素。

您可以使用内联 JSON 对象/数组(在脚本标签中)将国家/地区传递给 javascript。为了在用户编辑第一个元素后使事情变得更快,只需隐藏 (css: display: none;) 第一个构建选择元素并在每次用户想要编辑一行时克隆/移动它。

正如您所看到的,您可以使用这种方法采取很多路径,这完全取决于您想要优化/工作多少。

于 2010-01-05T09:53:08.980 回答