我正在使用 Twitter Typeahead 插件:
https://twitter.github.io/typeahead.js/
以下是我正在使用的代码:
$(document).ready( function() {
var bestPictures = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: '/cgi-bin/admin-daily.cgi',
remote: {
url: '/cgi-bin/admin-daily.cgi?q=%QUERY',
wildcard: '%QUERY',
filter: function (parsedResponse) {
console.log(parsedResponse);
return parsedResponse;
}
}
});
$('#showSearchResults .typeahead').typeahead(null, {
name: 'best-pictures',
display: 'value',
source: bestPictures,
templates: {
empty: [
'<div class="empty-message">',
'unable to find any matches',
'</div>'
].join('\n'),
suggestion: function(data){
console.log(data);
return Mark.up("<img src=\"{{image_url}}\" style=\"height:50px\"> <strong>xx{{title}}yy</strong>", data);
}
}
});
});
现在,这种方法有效 - 但它似乎只得到1个结果。以下是我的请求返回的JSON:
[{ “IMAGE_URL”: “https://steampunk-d72.kxcdn.com/daily/7/817-YlMCxegOPpB5Dsob8rw.jpg”, “标题”:“蒸汽朋克 自行车”, “ID”: “819”},{ “IMAGE_URL”: “https://steampunk-d72.kxcdn.com/daily/1/1041-w0ScJAzItAnL3iFL7Ji1A.jpg” ,“title”:“Steampunked Bike”,“id”:“1043”},{“image_url”:“https://steampunk-d72.kxcdn.com/daily/4/834-vhJ2bLI9yLdGAbfGetiewA .jpg“,”title“:”詹姆斯赖斯用勺子做的自行车“,”id“:”836“},{”image_url“:”https://steampunk-d72.kxcdn .com / daily / 0/1490-Iqr6FlNjgRgzTRKEYMBq1A.jpg“,”title“:”自行车零件灯由ilmecca produzioni“,”id“ : “1494”}]
...正如您所看到的,有多个条目,但由于某种原因它似乎在第一个之后“停止”:
起初我认为这是我的代码的问题,但我不太确定。也许其他人可以发现最新情况?
上图中的第34行是:
console.log(data);
...在循环中(这让我很困惑,因为它只显示1个转储 - 而不是几个,这是JSON中返回的内容)
答案 0 :(得分:0)
我不太清楚为什么 - 但它决定立即行动!
$('#showSearchResults .typeahead').typeahead(null, {
name: 'best-pictures',
display: 'value',
source: bestPictures,
templates: {
empty: [
'<div class="empty-message">',
'unable to find any matches',
'</div>'
].join('\n'),
suggestion: function(data){
return Mark.up("<div class=\"view-daily\" rel=\"{{id}}\"><img src=\"{{image_url}}\" style=\"height:50px\"> <strong>{{title}}</strong></div><br>", data);
}
}
});
所有我真的做了,取出了console.log()call inside the
建议:`部分 - 不确定为什么会修复它,但似乎有:)