Javascript 使用JQuery UI自动完成从JSON搜索数据不起作用

如何使用获取的json数据使用JQuery UI自动完成？我的车坏了

我使用这个示例，但不是从json获取硬编码数据

我的json数据来自url

localhost/myproject/output/names

html

编辑

我已经用@artm评论的json数据解决了这个问题。现在是

[{John Smith}，{Juan dela Cruz}]

---

但另一个问题是，当我键入字母

o

时，建议同时输入这两个字母，即使只有

John Smith

包含

o

。如何解决这个问题？

例如，jQuery UI自动完成需要一个字符串数组

["John Smith", "Juan dela Cruz"]

或具有

标签

和

值

属性的对象数组，例如：

[ { label: "name", value: "John Smith" }, { label: "name", value: "Juan dela Cruz" }... ]

如果您的数据源没有直接以这种格式发送数据，您可以向选项传递一个函数，在该函数中，您可以从数据源检索数据并相应地修改它

该函数接收两个参数：

• 具有单个

  术语
  属性的请求对象，其值为用户输入

• 一个回调函数，您应该以正确的格式向其传递数据

试一试

$(function() {
  $( "#search" ).autocomplete({
   source: function(request, response){
     $.ajax("localhost/myproject/output/names",{ // retrieve the data
          //ajax settings
         success: function(data){
            var matches = $.map(data,function(item){ // create an array of strings

               // find the matching items manually in insert to the array
               if(item.fullname.indexOf(request.term)>=0)
                 return item.fullname;
            });
            response(matches); // pass the results to response callback
         }
     });
   }
  });
});

---

---

旁注：代码没有经过测试，只是为了提供一个大致的概述

响应应该是

[“John Smith”，“Juan dela Cruz”]

我如何在PHP中做到这一点？因为我只是在查询全名的输出中使用了

json\u encode

，我不懂php，在此处搜索。您没有处理json响应？您是从服务器获取json响应还是在实现它时遇到问题？我遇到了一个错误

Uncaught TypeError:无法使用'in'运算符搜索

@Port8080这里是您提到的json结构的一个示例。。。

["John Smith", "Juan dela Cruz"]

[ { label: "name", value: "John Smith" }, { label: "name", value: "Juan dela Cruz" }... ]

$(function() {
  $( "#search" ).autocomplete({
   source: function(request, response){
     $.ajax("localhost/myproject/output/names",{ // retrieve the data
          //ajax settings
         success: function(data){
            var matches = $.map(data,function(item){ // create an array of strings

               // find the matching items manually in insert to the array
               if(item.fullname.indexOf(request.term)>=0)
                 return item.fullname;
            });
            response(matches); // pass the results to response callback
         }
     });
   }
  });
});