为静态html页面实现国家/州/城市选择_Html_Country_Countries

为静态html页面实现国家/州/城市选择

html

为静态html页面实现国家/州/城市选择,html,country,countries,Html,Country,Countries,我们运行一个静态网站网站表单提交连接到一个用于处理表单数据的服务，然后转发到另一个服务来处理数据和处理请求。我们注意到，国家-州-城市的选择需要统一，以便更好地处理这些数据。有这样的列表，例如：这意味着没有非唯一的值，比如如果你给用户一个文本输入，他会写一次“伦敦”，一次“伦敦”或“我来自伦敦” 因此，一个列表具有用户输入的唯一值这对一个动态网站来说是没有问题的，我加载国家数据，在选择一个国家时，我提供可用的州，如果通过，我提供城市。问题是，这个网站是静态的，例如html 因此，要获得类似

我们运行一个静态网站

网站表单提交连接到一个用于处理表单数据的服务，然后转发到另一个服务来处理数据和处理请求。我们注意到，国家-州-城市的选择需要统一，以便更好地处理这些数据。有这样的列表，例如：

这意味着没有非唯一的值，比如如果你给用户一个文本输入，他会写一次“伦敦”，一次“伦敦”或“我来自伦敦”

因此，一个列表具有用户输入的唯一值

这对一个动态网站来说是没有问题的，我加载国家数据，在选择一个国家时，我提供可用的州，如果通过，我提供城市。问题是，这个网站是静态的，例如html

因此，要获得类似的体验，需要将整个国家/地区列表数据库发送到客户端，这太过分了，大约有10 MB。

您可以创建一个页面，其中包含所有50个州的列表作为超链接。每个州都会链接到该州每个城市的页面。这样一来，你就不用发送10 MB的数据，而是有10 MB的网页，用户可以选择他们需要的网页

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Unordered List</title>
   </head>

   <body>
      <ul>
        <li><a href = "/html/Alabam/Cities.html"> Alabama </a></li>
         <li>Alaska</li>
         <li>Arizona</li>
         <li>Arkansas</li>
        <li>etc</li>
      </ul>
   </body>

</html>


HTML无序列表


阿拉斯加
亚利桑那州
阿肯色州
等

类似于上述代码的东西应该可以工作。每个列表项都是一个超链接，但您需要将相关文件放在href中

那么，问题是什么？如何在不加载10MB数据的情况下执行此操作？