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

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>');
}