ajax成功后如何在文本框中显示多个自动完成值答案

【问题标题】：how to display mutiple autocomplete value in a textbox after a successful ajaxajax成功后如何在文本框中显示多个自动完成值
【发布时间】：2019-10-02 10:03:34
【问题描述】：

我正在编写的代码不显示已由 Ajax 成功检索的自动完成多个值。我的显示 html 是

<input type="text" name="s_to" id="s_to" class="controls">

我的 jquery：

<script>

$("#s_to").keyup( function() { 
    url = "<?php echo base_url(); ?>index.php/<?php echo $loc_pts; ?>/ajax_email";       
    $( "#s_to" ).autocomplete({
        source: function( request, response ) {

            var s_to = extractLast(request.term);
            $.ajax({
                url: url,
                type: "POST",
                data: {s_to: s_to},
                dataType: "json",
                success:function(response) {
                    response.s_to;
                }
            });
        },focus: function() {                
            return false;
        },
        select: function( event, ui ) {
            var terms = split( $('#s_to').val() );

            terms.pop();               

            if(duplicate($('#s_to').val(), ui.item.label)){
                terms.push( ui.item.label );

                terms.push( "" );
                $('#s_to').val(terms.join( ", " ));            
            }
            return false;
        }

    });
});

function duplicate(f,s){
  if( f.match(new RegExp("(?:^|,)"+s+"(?:,|$)"))) {
     return false;
   }else{
  return true;
   }
}   

function split( val ) {
  return val.split( /,\s*/ );
}

function extractLast( term ) {
  return split( term ).pop();
}

我希望我可以在文本框中插入多个输入，但没有输出选择。因此，我无法通过单击或键盘箭头键自动完成输入

【问题讨论】：

您可以查看this answer 并告诉我它是否解决了您的问题
@ForwardWeb 问题有所不同，因为他动态添加了一个元素，而我被限制遵循我的主题。我只需要出现建议下拉菜单，因为 ajax 部分已经返回正确的数据。

标签： javascript php jquery css ajax

【解决方案1】：

我认为您的 source 函数有问题。您不调用 response 回调（函数的第二个参数），因此永远不会设置 source。这应该有效：

source: function( request, response ) {
 var s_to = extractLast(request.term);
 $.ajax({
   url: url,
   type: "POST",
   data: {s_to: s_to},
   dataType: "json",
   success:function(re) {
     response(re.s_to);
   }
 });
}

【讨论】：