如何使用复杂 JSON 的自动建议制作 textarea答案

【问题标题】：How to make textarea with auto suggest from complex JSON如何使用复杂 JSON 的自动建议制作 textarea
【发布时间】：2017-10-27 11:17:28
【问题描述】：

我正在寻找可以支持嵌套（查找）字段自动完成的自动完成库

就像我有一个数据数组

var Data=[
  "Name",
  {
    "Employee": [
      "name",
      "address",
      "phone"
    ]
  },
  "Size",
  "LastName"
  {
    "Vacation": [
      "name",
      "address",
      "phone"
    ]
  }
]

如果我输入 'N' 那么它应该建议 Name, LastName

如果我输入 'E' 它应该建议 Employee 和

如果我输入 Employee . 那么它应该建议 Employee 对象的属性，例如姓名、地址和电话

Jquery 自动完成库是否具有这种灵活性，或者如果有人知道具有这种灵活性的不同库，请建议我。

【问题讨论】：

是的，尝试使用 ajax 自动完成。在服务器端，当您返回 json 时，根据您的要求应用您的条件
@VenkateshKonatham 我的所有数据都在本地。你能举一些我的例子吗？
@Sam 这可以做到。需要更多细节来帮助示例。例如，数据应该如何显示？选择项目时会发生什么？

标签： javascript jquery node.js jquery-ui jquery-ui-autocomplete

【解决方案1】：

这解决了您问题的第一部分：

工作示例：http://jsfiddle.net/Twisty/a3vffhfn/

JavaScript

var myData = [
  "Name", {
    "Employee": [
      "name",
      "address",
      "phone"
    ]
  },
  "Size",
  "LastName", {
    "Vacation": [
      "name",
      "address",
      "phone"
    ]
  }
];

$(function() {
  $("#desc").autocomplete({
    minLength: 1,
    source: function(req, resp) {
      var q = req.term;
      var results = [];
      console.log("Term:", q);
      $.each(myData, function(k, v) {
        console.log(k, v, typeof v);
        if (typeof v == "string") {
          // Item is String
          if (v.indexOf(q) === 0) {
            // If term matches String, add to Results
            results.push(v);
          }
        }
        if (typeof v == "object") {
          // Item is Object
          $.each(v, function(j, z) {
            if (j.indexOf(q) === 0) {
              // Check object keys, if matches, add key to Results
              results.push(j);
            }
          });
        }
      });
      console.log("Results:", results);
      resp(results);
    }
  });
});

如果您输入“N”或“E”，则会出现“姓名”和“员工”。这没有解决您问题的第二部分。由于您没有指定您希望如何显示这些数据，因此不容易回答。

【讨论】：