Javascript HTML表单下拉数据源 我知道这是一个讨论了很多次的话题，但是我找不到我想要的

问题：作为动态下拉框的数据源，目前的最佳做法是什么？例如，用户在下拉列表#1中选择一个汽车品牌，在下拉列表#2中可以看到所有可用车型的概览

就我个人而言，我看到了三种情况，谷歌搜索并不能帮助我找到最佳实践：

根据下拉列表#1的更改查询数据库，使用可用模型进行JS刷新#2

查询一个平面文件（JSON，XML，…），使用可用的模型让JS刷新#2

一次加载所有数据，让JS管理选择

本例或多或少涉及静态数据，因此每晚都可以生成平面文件而不会出现问题

从性能的角度来看，我认为3是最不受欢迎的，但是在1和2之间，我不确定今天的数据库优化和可用带宽。 我主要关心的是最终用户体验

---

谢谢

我认为这取决于每种情况

您应该随时准备好让数据增长；但是你应该知道它应该如何成长。此外，如果您的客户端和服务器端逻辑得到了很好的实现，那么查询几百个寄存器不会花费很长时间

停下来做一个快速计算：查询数据库中的一些名称。数据库有5k条记录，索引良好。在这5公里中，只有300公里符合你的标准。那么，让我们返回这300个平均长度为50个字符的名称。您有大约15kb的信息正在传输。现在，在一个普通的网络连接中，这只需要不到半秒钟的时间就可以被接收到

然而，对于用户体验而言，必须浏览下拉列表以查找三百个姓名实在是不好。因此，用下拉列表代替自动完成的文本框可能是个好主意。想进一步提高用户体验吗？实现一个偏好逻辑，以了解用户最有可能选择的名称（可能基于他以前的输入和/或其他用户最近几天的输入——您知道的最流行的名称）

如果您主要关心的是用户体验，那么您必须像拥有体验的用户一样思考。试着这样想：

• 什么会更好？有几百个条目的下拉列表还是有自动完成功能的文本框
• 也许自动完成会让用户有点不知所措，那么在文本框旁边列出一些例子怎么样
• 更妙的是，如果这些例子是我可能会选择的呢

回到问题上来，重复执行查询可能会很昂贵，所以一点缓存就好了。有了Html5的会话存储和本地存储，这真的很容易做到。另外，在IndexedDB中跟踪一些表也是个好主意，不是吗

---

用户体验的最佳实践是思考什么能让用户满意。尽量充分利用它。

解决这类问题有各种有效的方法，这最好取决于主要由您的环境驱动的各种因素。取决于数据量。然而，为了简单起见，我倾向于输出页面中的所有数据，可以是一个具有多个级别的下拉列表，也可以是基于第一个选项显示和隐藏的多个下拉列表