jQuery Autocomplete 没有下拉建议答案

【问题标题】：jQuery Autocomplete no drop down suggestionjQuery Autocomplete 没有下拉建议
【发布时间】：2019-11-13 15:23:59
【问题描述】：

我的页面中有一个表单，我想添加自动完成功能以向用户建议一些已经存在的名称

当我在“名称”输入文本框中输入时，我在控制台中看到它检索以我输入的任何字母开头的现有名称...但我没有看到任何下拉菜单来选择网页。我错过了什么吗？如何获得建议的自动完成下拉菜单？

<script src="{% static '/js/jquery-ui-1.12.1.min.js' %}"></script>
<script>
$(function() {
    $("#id_name").on('keyup', function(){
        var value = $(this).val();
        $.ajax({
        url: "{% url 'ajax-autocomplete' %}",
        data: {
          'search': value
        },
        dataType: 'json',
        success: function (data) {
            list = data.list;
            $("#id_name").autocomplete({
            source: list,
            minLength: 3
            });
        }
    });
  });
  });
</script>

【问题讨论】：

标签： jquery html ajax autocomplete

【解决方案1】：

使用datalist 并动态填充它：

<input list="listName" id="inputName" type="text" autocomplete="off">
<datalist id="listName"></datalist>

Javascript：

$.ajax({
    url: '/api/my_api_url',
    dataType: 'json',
    success: function (jsonData) {
        $('#listName').empty();
        jsonData.forEach(function (person) {
            var option = document.createElement('option');
            option.value = person.name;
            $('#listName').append(option);
        });            
    }
});

【讨论】：