javascript - 您是否重复使用选择框中的值？

Question

假设我在html页面中有一个选择框。并且该选择框中的值来自一个数据库查询，该查询返回一个不那么小的选项列表。
现在，如果我需要添加另外 4 个显示相同选项列表的选择框，我是否必须复制代码并发送回浏览器4*(select_box_result_size)，或者这通常以不同的方式完成？

score 3 · Accepted Answer

无论您如何管理服务器端代码，答案是每个选择框都需要自己的一组选项。也就是说，如果所有选项都相同，那么您应该只对数据库进行一次查询，并使用一个函数生成您需要的所有选择框。只需从数据库中获取选项，将它们存储在变量中，然后创建您的框。

请注意，在您的 HTML 中，每个框都会将值硬编码到其中，因此您的客户端代码将有重复的数据，但这并不重要。重要的是您必须维护的代码是干净的，并且您对数据库施加的压力尽可能小。一个查询 + 一个功能就是您所需要的。

如果性能确实是一个问题，您总是可以使用 JavaScript 动态生成组合框。您基本上可以嵌入一个，然后再复制四次。但是，您需要为此考虑两件事：

您真的有由这些组合框引起的性能问题吗？（可能不是）
组合框是否如此之大，以至于通过网络连接加载 HTML 所花费的时间实际上比使用 JavaScript 复制该框四次所需的时间更长？（同样，可能不会……记住，盒子越长，复制所需的时间就越长。）

除非您有 1000 多个选项，否则我建议您只坚持四次生成该框。如果你确实有那么多，那么做两件事：

基准。创建两个页面，一个有一个组合框，一个有四个并比较大小。然后比较加载时间。
考虑改进你的用户界面。也许如果您有 1000 个选项，最终用户最好实施某种过滤过程以减少必要元素的数量……即，如果您有一个包含世界所有城市的框，请选择一个框国家，然后通过 JSON 请求仅使用适用的城市填充城市框。

score 0 · Accepted Answer

并且该选择框中的值来自一个数据库查询，该查询返回一个不那么小的选项列表。

为了用户友好，您可以尝试自动建议，有一些库可以解决此问题，但您可以尝试编写自己的库。

如果根据您的服务器端脚本多次显示相同的数据（4 次），则最好在内存中获取数据并生成选择而不是查询 4 次。

我必须复制代码吗

最好不要重复，至少你可以写一个辅助函数来生成选择列表。如果您认真考虑从 html 标记中删除代码，您可以考虑使用许多 MVC 框架之一，这些框架使用模板并允许您将数据绑定到它。

2 回答 2