Javascript 带jQuery标志的国家选择器

我想用国家和相关标志填充我的下拉列表。我问了这个问题

但仍然无法理解，因为工作模式已被打破。

---

如何做到这一点？

您正在使用引导程序吗？如果是这样，下面的链接中有一个非常有趣的表单帮助程序

适合您情况的示例HTML代码片段是

这里有一个基于以下内容的可搜索下拉列表：

$（函数（）{
var等国家=[
{id:'AF'，text:'Afghanistan'}，
{id:'AX'，text:'Aland Islands'}，
{id:'AL'，text:'albana'}，
{id:'DZ'，文本：'Alegaria'}，
{id:'AS'，text:'美属萨摩亚'}，
//等
];
国家职能（国家）{
如果（！country.id）{return country.text；}
var$国家=$(
'' +
''+国家/地区。文本+“”
);
返回$country；
};
//假设您有一个名为country的select元素
//例如。
$（“[name='country']”）。选择2({
占位符：“选择一个国家”，
templateResult:formatCountry，
数据：等国家
});
});

---

是否可以将其应用于表格中？@YoussefBoudaya是的，请检查此项。我需要存储国家的id，以便在编辑表单中再次查找。我可以将另一个值传递到iso国家吗@ArtemVasiliev@rogue39nin当然，您可以在调用之前设置相关的$（“[name='country']”）输入值。在输入值上选择2，或稍后通过类似$（“#我的国家/地区id”）.val（'AL'之类的代码选择2）

$(function() {
  var isoCountries = [
    { id: 'AF', text: 'Afghanistan'},
    { id: 'AX', text: 'Aland Islands'},
    { id: 'AL', text: 'Albania'},
    { id: 'DZ', text: 'Algeria'},
    { id: 'AS', text: 'American Samoa'},
    // etc
  ];

  function formatCountry (country) {
    if (!country.id) { return country.text; }
    var $country = $(
      '<span class="flag-icon flag-icon-'+ country.id.toLowerCase() +' flag-icon-squared"></span>' +
      '<span class="flag-text">'+ country.text+"</span>"
    );
    return $country;
  };

  //Assuming you have a select element with name country
  // e.g. <select name="name"></select>

  $("[name='country']").select2({
    placeholder: "Select a country",
    templateResult: formatCountry,
    data: isoCountries
  });

});