如果文本不为空，为什么自动完成小部件不起作用？

Question

下面的代码如何可能仅在文本为空时才显示数组...它应该在键入过程中显示列表，而不是在文本为空时显示列表。

步骤：

1. 专注于文本
2. ，输入文本，例如“abc”（此文本返回执行 ajax 调用的数组）
3. 没有任何反应

4. 删除“abc”，我可以正确看到该数组。

   $('#titolare').keyup(function(){
     var titolare = $.trim($('#titolare').val());
   
     $.ajax({
       类型：“帖子”，
       url: "page.php",
       数据：{ 标题：标题 }，
       成功：函数（消息）{          
         var obj = jQuery.parseJSON(msg);
   
         if (obj.结果){
           var tit = obj.titolare
             , tit_a = [];            
   
           $.each (tit, 函数 (a) {              
             tit_a[a] = { titolare: tit[a].titolare, cod_fis: tit[a].cod_fis };
           });         
   
               $("#titolare").autocomplete({
             最小长度：0，         
             来源：tit_a，
                   焦点：函数（事件，用户界面）{             
                       $("#titolare").val(ui.item.titolare);
                       返回假；
                   },
                   选择：函数（事件，用户界面）{            
                       $("#titolare").val(ui.item.titolare);
                       返回假；
                   }
               })
               .data( "自动完成" )._renderItem = 函数(ul, item) {          
                   返回 $(“
   ”)
                       .data( "item.autocomplete", item )
                       .append( "" + item.titolare + "
   ("+ item.cod_fis +")")
                       .appendTo( ul );
               };            
   
         }                                             
       }
     });        
   });
   

Answer 1

您不想使用 keyUp 函数。您可以像这样将 url 作为源，

$(document).ready(function(){
    $( "#titolare" ).autocomplete({
             source: "page.php",                }
             focus: function( event, ui ) {             
                        $("#titolare").val(ui.item.titolare);
                        return false;
                    },
                    select: function( event, ui ) {            
                        $("#titolare").val(ui.item.titolare);
                        return false;
                    }
    }).data( "autocomplete" )._renderItem = function(ul, item) {          
                    return $( "<li></li>" )
                        .data( "item.autocomplete", item )
                        .append( "<a>" + item.titolare + "<br />("+ item.cod_fis +")</a>")
                        .appendTo( ul );
                };  
});

并且在 page.php 中您可以返回相关的 JSON 对象列表。
http://jqueryui.com/demos/autocomplete/#remote

Answer 2

您可以在 #titolare 中使用自动完成小部件（不使用 keyup 侦听器），将 source 属性设置为可以执行 ajax 操作的函数您需要的调用和数据转换（现在您尝试使用 keyup 方法来完成）。

类似于：

$("#titolare").autocomplete({
      minLength: 0,         
      source: function(request, response){
          // ajax call and any data transformation here...
      },
      focus: function( event, ui ) {             
         $("#titolare").val(ui.item.titolare);
         return false;
      },
      select: function( event, ui ) {            
         $("#titolare").val(ui.item.titolare);
         return false;
         }
 })
 ...

看看这里。