从 php 文件中获取数据到 javascript

Question

下面的 javascript 应该是某种自动完成功能。我正在使用引导输入。

当我在输入字段中键入项目时，我可以看到建议，问题是我无法选择它们并填充输入字段。 知道它可能有什么问题吗？

<script type="text/javascript">
    $('#typeahead').typeahead({
    source:  function (query, process) {
         objects = [];
         map = {};

        return $.get('live_search.php?filter=relation', { query: query }, function (data) {
                console.log(data);
                var data = $.parseJSON(data);
                return process(data);   
            });


            $.each(data, function(i, object) {
            map[object.name] = object;
            objects.push(object.name);
            });

            process(objects);

    },
    updater: function(item) {
        $('#getSelection').val(map[item].name);
        $('#getValue').val(map[item].name);
        return item;
    }
});
</script>

Answer 1

看起来您的源方法立即从 $.get 调用返回，并且从未进入 $.each 迭代。将迭代代码移动到获取请求回调块中。

此外，您对 objects 和 map 的引用在 source 方法的范围内，但您在 updater 方法中引用它们

var typeahead = {
  objects: [],
  map: {},
};

$("#typeahead").typeahead({
  source: function(query, process) {
    return $.get("live_search.php?filter=relation", { query: query }, function(
      data
    ) {
      var data = $.parseJSON(data);

      $.each(data, function(i, object) {
        typeahead.map[object.name] = object;
        typeahead.objects.push(object.name);
      });

      return process(data);
    });
  },
  updater: function(item) {
    $("#getSelection").val(typeahead.map[item].name);
    $("#getValue").val(typeahead.map[item].name);
    return item;
  },
});