Question

我正在使用 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中返回的内容）

Answer 1

我不太清楚为什么 - 但它决定立即行动！

  $('#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建议：`部分 - 不确定为什么会修复它，但似乎有：）

Twitter typeahead - 为什么它只匹配一个结果？

1 个答案: