1

我已经使用 twitter typeahead 很长一段时间了,这对于我的远程数据来说非常简单方便。现在我决定升级到最新版本(typeahead.js 0.10.5),这样我就可以使用强大的猎犬引擎了。我对猎犬有很大的问题,下面是我直接从https://twitter.github.io/typeahead.js/examples/ prefetch 示例中使用的代码,无论如何该代码似乎都不起作用。

我认为url我打电话的那个是正确的,因为链接对我来说很好,我看到了所有的国家。我唯一改变的是prefetchremote它不适用于prefetch任何一个。我还在这里尝试了有关 stackexchange 的其他示例,这表明我在标题中正确调用了我的脚本,但是当我将 URL 更改为 twitter 提供的 URL 时,它不起作用。我想知道我是否正确使用了从 twitter-typeahead 示例中复制的代码。

    <div id="prefetch">
      <input class="typeahead" type="text" placeholder="Countries">
    </div>
<script type='text/javascript'>
$(function() {
   var countries = new Bloodhound({
      datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),       
      queryTokenizer: Bloodhound.tokenizers.whitespace,
      limit: 10,
      remote: {
        // url points to a json file that contains an array of country names, see
        // https://github.com/twitter/typeahead.js/blob/gh-pages/data/countries.json
        url: 'https://github.com/twitter/typeahead.js/blob/gh-pages/data/countries.json',
        // the json file contains an array of strings, but the Bloodhound
        // suggestion engine expects JavaScript objects so this converts all of
        // those strings
        filter: function (list) {
          return $.map(list, function (country) { 
            return { 
                name: country 
                }; 
            });
        }
      }
    });

    // kicks off the loading/processing of `local` and `prefetch`
    countries.initialize();

    // passing in `null` for the `options` arguments will result in the default
    // options being used
    $('#prefetch .typeahead').typeahead(null, {
      name: 'countries',
      displayKey: 'name',
      // `ttAdapter` wraps the suggestion engine in an adapter that
      // is compatible with the typeahead jQuery plugin
      source: countries.ttAdapter()
    });
});
</script>
4

0 回答 0