AJAX和datalists

Question

我正在尝试使用XML从网站获取城市列表，然后通过并将每个城市添加到数据列表中，这样当我输入输入时，它将过滤列表中的城市。 / p>

城市列表示例：

Aleppo
Alexandria
Alger
Almaty
Ankara
Anshan
Baghdad
Baku
Bandung
Bangalore
Bangkok
Barcelona

* [每个城市名称都在新行上]

当前的html：

<div id="namearea">
        <h2>City Name:</h2>

        <div>
            <input id="citiesinput" list="cities">
            <datalist id="cities"></datalist>

            <button id="search">
                Search
            </button>

            <span class="loading" id="loadingnames">
                Loading...
            </span>
        </div>
    </div>

当前的JS代码：

window.onload = function() {
    var request = new XMLHttpRequest();
    request.onload = processCities;
    request.open("GET", "url", true);
    request.send();
};

用Firebug检查页面显示没有任何东西被添加到datalist中，所以我想知道我做错了什么。我也尝试使用.responseText而不是.responeXML，但它没有任何区别。

[固定]
我将processCities（）函数更改为：

function processCities() {
    var response = this.responseText;
    var city = response.split("\n");
    var options = "";

    for(var i = 0; i < response.length; i++) {
        options += "<option value='"+city[i]+"'>\n";
    }
    document.getElementById("cities").innerHTML = options;
}

此代码似乎有效。

Answer 1

以下是发出请求的示例。如果你真的在使用XML，那么你必须解析它。如果能得到json，情况会更好。

＆＃13;

＆＃13;

var request = new XMLHttpRequest();
request.open('GET', '/my/url', true);

request.onload = function() {
  if (request.status >= 200 && request.status < 400) {
    // Success!
    var data = JSON.parse(request.responseText);
  } else {
    // We reached our target server, but it returned an error

  }
};

request.onerror = function() {
  // There was a connection error of some sort
};

request.send();

＆＃13;

＆＃13;

＆＃13;