使用字符串列表中的值填充 <select>答案

【问题标题】：Populating a <select> With Values From a String List使用字符串列表中的值填充 <select>
【发布时间】：2012-01-26 13:15:51
【问题描述】：

我有一个与AccuWeather API 一起使用的字符串列表，名为WeatherLocationDatabase.txt，看起来有点像这样：

CityName="Aachen, DE" Location="EUR|DE|GM011|AACHEN" Country="Germany"
CityName="Aalborg, DK" Location="EUR|DK|DA007|AALBORG" Country="Denmark"
CityName="Aalesund, NO" Location="EUR|NO|NO007|AALESUND" Country="Norway"
CityName="Aare, SE" Location="EUR|SE|SW006|AARE" Country="Sweden"
CityName="Aarhus, DK" Location="EUR|DK|DA001|AARHUS" Country="Denmark"
CityName="Aba, NG" Location="AFR|NG|NI008|ABA" Country="Nigeria"
CityName="Abadan, IR" Location="MEA|IR|IR016|ABADAN" Country="Iran"
CityName="Abakan, RU" Location="ASI|RU|RS033|ABAKAN" Country="Russia"
CityName="Abbotsford, CA" Location="NAM|CA|BC|ABBOTSFORD" Country="Canada"
CityName="Abeokuta, NG" Location="AFR|NG|NI000|ABEOKUTA" Country="Nigeria"
CityName="Aberdeen, UK" Location="EUR|UK|UK002|ABERDEEN" Country="United Kingdom"
CityName="Abidjan, CI" Location="AFR|CI|IV002|ABIDJAN" Country="Ivory Coast"
...

有没有办法使用 AJAX 来填充一个使用 jQuery 应该看起来像这样的 <select>？

<select>
    <option value="CityName">CityName</option>
    <option value="CityName">CityName</option>
    <option value="CityName">CityName</option>
    <option value="CityName">CityName</option>
    ...
</select>

【问题讨论】：

如果该列表是 XML 格式。
当然，只要看看 [previous question][1] [1] 中的这个例子：stackoverflow.com/questions/815103/…
那个问题是指格式良好的 JSON。这家伙看起来像是有一个逗号分隔的列表。你能格式化这个文本文件来准备它吗？还是其他东西的输出？

标签： jquery ajax regex list populate

【解决方案1】：

使用该文本文件，您可以使用 jQuery 和 make：

$.get('WeatherLocationDatabase.txt', function(text){
  var markup = "",
      i, item,
      data = text.split(/CityName="(.+)"\sLocation="(.*)"\sCountry="(.*)"\s?/mg).filter(function(e){return e});
  for( i = 0; item = data[i]; i+=3){
    // no need to specify value if equals to inner text.
    markup += "<option>" + item + "</option>";
    // you could break if data[i+1] or data[i+2] changes
  }
  $("#someSelectID").append(markup);
});

解释var data：我通过 RegEx 拆分以匹配 CityName、Location 和 Country 值，然后使用过滤器 hack 删除由 RegEx 拆分生成的空字符串索引。此时，数据应如下所示：

["Aachen, DE", "EUR|DE|GM011|AACHEN", "Germany", "Aalborg, DK", "EUR|DK|DA007|AALBORG", "Denmark", "Aalesund, NO", "EUR|NO|NO007|AALESUND", "Norway", "Aare, SE", "EUR|SE|SW006|AARE", "Sweden", "Aarhus, DK", "EUR|DK|DA001|AARHUS", "Denmark", "Aba, NG", "AFR|NG|NI008|ABA", "Nigeria", "Abadan, IR", "MEA|IR|IR016|ABADAN", "Iran", "Abakan, RU", "ASI|RU|RS033|ABAKAN", "Russia", "Abbotsford, CA", "NAM|CA|BC|ABBOTSFORD", "Canada", "Abeokuta, NG", "AFR|NG|NI000|ABEOKUTA", "Nigeria", "Aberdeen, UK", "EUR|UK|UK002|ABERDEEN", "United Kingdom", "Abidjan, CI", "AFR|CI|IV002|ABIDJAN", "Ivory Coast"]

基本上是：[CityName1, Location1, Country1, CityName2, Location2, Country2, ..., CityNameN, LocationN, CountryN] 其中 N 是行号。

然后我每 3 个项目迭代一次（因为有 3 个属性）

希望这会有所帮助。

【讨论】：