html - 将国家/地区的 HTML 选择添加到多个地方

Question

所以我想在我的网站上的多个地方（几个表格）有一个国家的 HTML 选择
我有所有国家的这个大选择。但是现在呢？
将它“包含”在多个 html 文件中而不使它们膨胀/重复代码的最优雅的方法是什么

Answer 1

这个问题似乎是“如何在 HTML 文件中包含 HTML 文件？”的特例，而实际的答案是“你不需要”。您可以在许多技术（例如 PHP）中在服务器端进行包含，但这是一个不同的问题。您可以使用客户端 JavaScript 进行包含，但是当 JavaScript 被禁用（或其中发生运行时错误）时，这会使控件不存在。

在国家选择菜单的情况下，最好的方法是不要有一个，除非它非常小而且很专业（我认为欧盟成员国的名单是上限，如果不是以上的话）。大型下拉菜单的可用性很差。此外，国家列表很难维护——我想我从来没有（在网页上）看到有正确的世界国家列表的下拉列表。

而是使用文本输入框。如果您需要将输入解析为国家代码（并验证它是否是公认的国家），请执行该服务器端。

Answer 2

If you use php, you can create the HTML select list once inside a file, and then just include the file everywhere you need it: http://php.net/manual/en/function.include.php

Or you can make a class and return the list as the output of a method or static method of that class, wherever you need it, on any php page: http://php.net/manual/en/language.oop5.php

Answer 3

我认为最好的方法是创建或使用一些可以在多个 html 文件中使用的现有 js 小部件。检查此示例以供参考。国家选择示例

在这种情况下，您只需要编写一次代码。

Answer 4

您可以在您的国家/地区添加一些 javascript，并且（使用 jQuery）可以执行以下操作

var countries = ["UK", "USA", "India"]; //list all countries in one place

$.each(countries, function(i, val){
   $("#CountryList").append(<option value="'+val+'">'+val+'</option>');
});

这假定 CountryList 是每个页面上的空选择元素。此代码仅用于指导，您需要编写自己的实现才能使其工作。