这个typeahead.js代码有什么问题?

时间:2013-07-02 15:54:25

标签: javascript jquery typeahead

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"}
]

1 个答案:

答案 0 :(得分:5)

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

组成数据集的各个单位称为datums。规范形式的数据是具有value属性和tokens属性的对象。 value是表示基准的基础值的字符串,tokens是一个字符串集合,用于在匹配基准中与给定查询匹配 typeahead.js

所以你的json项应该具有以下结构:

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