После выбора элемента списка данных выпадающий список остается. Как я могу убедиться, что он исчезает? - PullRequest
0 голосов
/ 17 мая 2018
<input class="c-search__textbox c-form__textbox"  id="top-query" list="top-json-datalist" onkeyup="suggest(this)" autocomplete="off" type="text" name="q" value="" placeholder="Type something . . .">

<datalist id="top-json-datalist"></datalist>

function suggest(elem) { 

if(elem.id == "query") {
    document.getElementById("query").disabled = false;
    var dataList = document.getElementById('json-datalist');
    var input = document.getElementById('query');
} else if (elem.id == "top-query") { 
    document.getElementById("top-query").disabled = false;
    var dataList = document.getElementById('top-json-datalist');
    var input = document.getElementById('top-query');
}

var request = new XMLHttpRequest();

// Handle state changes for the request.
request.onreadystatechange = function(response) {
  if (request.readyState === 4) {
    if (request.status === 200) {
        var data = JSON.parse(request.responseText);
        var jsonOptions = data.hits;
        dataList.innerHTML = '';
        jsonOptions.forEach(function(item) {
            var option = document.createElement('option');
            option.value = item["query"];
            dataList.appendChild(option);
        });
    } 
  }
};

request.open('GET','https://api.lite.s4p.jp/v1/suggest&query='+input.value,true);
request.send();

Как видите, я могу загружать элементы списка данных из вызова ajax.Я могу видеть элементы в выпадающем списке.Однако проблема заключается в том, что при выборе элемента раскрывающийся список остается.

Спасибо!

1 Ответ

0 голосов
/ 17 мая 2018

Мне интересно, вы что-то делаете в своей функции подсказки, которая вызывает проблему, работает ли она, если вы удалите onkeyup = "предложить (это)"?

Другое дело, что поддержка datalist кажется довольно ошибочной, согласно caniuse . Вы пробовали в других браузерах?

Извините, я бы только что прокомментировал, но мне пока не хватает представителя.

...