jquery – Typeahead.js – 显示有更多的结果

前端之家收集整理的这篇文章主要介绍了jquery – Typeahead.js – 显示有更多的结果前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用的是typeahead.js,一切都适用于我,除了一件事情:

我在建议下拉列表中只显示5个条目,但是如果有更多的结果,我想向用户展示,结果更多(但结果本身并不仅仅是信息,结果更多),所以他继续打字

>我不想要一个滚动条
>我不想显示其他结果
>只是一个信息,有更多的结果

请看屏幕.

解决方法

我正在寻找完全相同的东西,想想,这就是你需要的(见2014年2月4日的jharding的评论):
https://github.com/twitter/typeahead.js/issues/642#issuecomment-34025203

链接中的示例也适用于页脚模板,如下所示.

您可以从Bloodhound(您可以访问AJAX请求的结果)的过滤器函数中将结果数保存在DOM中,如下所示:

var bloodHound = new Bloodhound({
  queryTokenizer: Bloodhound.tokenizers.whitespace,limit: 5,remote: {
      url: url+'%QUERY',filter: function (srcs) {
        // store field JSON response to the DOM
        $('#num-results').html(srcs.numResults);
        ...
      }
    }
});
bloodHound.initialize();

现在关键点从上面的链接
您可以包装Handlebars模板(这实际上是一个函数),并以这种方式扩展/替换传递给模板的Handlebars上下文:

var footerTmpl = Handlebars.compile('{{numResults}} results for {{query}}');

var footer = function(context) {
  var numResults = $('#num-results').html();
  var data = { 'numResults': numResults,'query': context.query };
  return footerTmpl(data);
}

// ...
templates: {
  footer: footer
}
// ...

猜你在找的jQuery相关文章