输入“@”后无法在下拉列表中显示数据

Question

我有一个场景，其中有一个输入字段，我希望当用户键入“@”时，会自动出现一个下拉列表，其中包含动态数据列表，然后用户可以从下拉列表中选择一个值因为它是在正常的下拉列表中完成的。

我能够捕获值“@”，以便我知道用户何时键入它，并且我还能够通过ajax获取动态数据列表，但是我无法显示数据用户输入@

后立即下拉

看起来应该是这样的

任何人都可以帮助我吗

<input type="text" value="" id="dSuggest" />
   $(document).ready(function() {
    $("#dSuggest").keyup(function() {
        var dInput = $(this).val();
        if(dInput == '@'){  
         $.ajax({
            type: "get",
            url: "<?php echo base_url(); ?>data/name",
            success: function (data) 
                {
                    console.log(data)
                    $('#view_workforce').html(data);
                }
            });
        }
    });
});

Answer 1

在您的成功功能中构建下拉列表

success: function(data) {
  var list = [];
  $.each(data, function(i, v) {
    list.push("<li>" + v + "</li>");
  });
  $("#dSuggest").insertAfter('<ul>' + list.join('') + '</ul>');
}