javascript - 这个 typeahead.js 代码有什么问题？

Question

typeahead.js 和 jquery，使用 typeahead.js 中的示例。脚本似乎都正确加载，但在输入时没有任何反应。

<script src='http://code.jquery.com/jquery.min.js'></script>
<script src='typeahead.min.js'></script>
<script src='http://twitter.github.io/hogan.js/builds/2.0.0/hogan-2.0.0.js'></script>

<input class="typeahead" type="text" placeholder="stuff" autocomplete="off" spellcheck="false" dir="auto" style="position: relative; vertical-align: top; background-color: transparent;">

<script>
  $(function(){

        $('.typeahead').typeahead({                              
          name: 'twitter-oss',                                                        
          prefetch: './repos.json',                                             
          template: [                                                                 
            '<p class="repo-language">{{language}}</p>',                              
            '<p class="repo-name">{{name}}</p>',                                      
            '<p class="repo-description">{{description}}</p>'                         
          ].join(''),                                                                 
          engine: Hogan                                                               
        });
  })
</script>

// repos.json
[
  {"name":"Joe", "description":"Person", "language":"en"}
]

Answer 1

查看预输入文档 ( https://github.com/twitter/typeahead.js/#datum )。

组成数据集的各个单元称为datums。基准的规范形式是具有value属性和tokens属性的对象。value是表示数据基础值的字符串，是帮助typeahead.js将数据与给定查询匹配tokens的字符串集合。

因此，您的 json 项应具有以下结构：

{
 "name":"Joe", 
 "description":"Person", 
 "language":"en",
 "value" : "Joe",
 "tokens" : ['Joe']
}