Javascript Twitter typeahead.js 0.11.1预回迁不工作

我正在尝试预取整个JSON数据库（55kb），以便与typeahead.js 0.11.1一起使用。我一整天都在为此而挣扎，我发现typeahead.js文档在这方面非常基本

我的JSON如下所示：

[{
    "id": 1,
    "name": "Green"
}, {
    "id": 2,
    "name": "Red"
}, {
    "id": 3,
    "name": "Blue"
}]

还有javascript：

$(function() {

    var tagSuggestion = new Bloodhound({
        datumTokenizer: function(d) {
            return Bloodhound.tokenizers.whitespace(d.name);
        },
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        limit: 10,
        prefetch: {
            url: 'ajax.json-colors.php'
        }
    });

    $('.typeahead').typeahead({
        hint: true,
        highlight: true,
        minLength: 2
    }, {
        name: 'tagSuggestion',
        displayKey: 'name',
        source: tagSuggestion.ttAdapter()
    });

});

---

我不知道我做错了什么，但typeahead不支持预取。

也许类似的方法可以奏效：

var tagSuggestion = new Bloodhound({
    datumTokenizer: function(d) {
        return Bloodhound.tokenizers.whitespace(d.name);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    limit: 10,
    prefetch: {
        url: 'ajax.json-colors.php',
        filter: function (data) {
            //console.log(data.response) --> see if this is your data in example above
            return $.map(data.response, function (tags) {
                return {
                    name: tags.name
                };
            });
        }
    }
});

这是假设在预回迁中返回的数据是以包含数据的响应对象的形式出现的。可能需要根据传递给筛选器的

数据

进行修改

---

如果ajax响应是一个键值，键值是“response”。没有小提琴，我只能猜测问题。

最后，通过使用遥控功能解决了问题，并更改了以下代码：

var tagSuggestion = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: 'ajax.json-colors.php?query=%QUERY',
        wildcard: '%QUERY'
    }
});

$('.typeahead').typeahead({
    minLength: 2,
    highlight: true
},
{
    name: 'search',
    display: 'value',
    source: tagSuggestion
});

---

typeahead似乎不使用php文件作为预取源，只接受json文本文件。

您可能希望将json文件重命名为

ajax.json colors.json

，而不是

ajax.json colors.php

，并确保路径存在。检查是否有任何控制台错误。@Arathisrekumar数据库应该是动态的，将数据接收到javascript对象中没有问题，这样您就可以看到数据通过前端了？预回迁确实发出ajax请求？@ArathiSreekumar是的，数据即将到来，预回迁发出ajax请求插件上一次更新是在大约2年前，我建议切换到