3

我在使用 JSON Web 服务实现 Twitter Bootstrap Typeahead 功能时遇到问题。

我查看了该网站上的所有示例，但找不到任何可行的方法。我知道我的 JSON Web 服务有效；我可以在浏览器中输入地址，它会返回我期望的 JSON，并将 MIME 类型设置为“application/json”。

我有这个JavaScript

<body>

我的 HTML 页面：

<script>
    $('#typeahead').typeahead({
        source: function (query, process) {
            return $.getJSON(
                'http://localhost:8732/IngredientsService/search/',
                { query: query },
                function (data) {
                    return process(data);
                });
        }
    });
</script>

我有这个代码作为我的“输入”：

<input type='text' id='typeahead' class='typeahead' data-provide="typeahead" data-items="10" />

谁能解释为什么这不起作用？

4

3 回答 3

3

根据最后一条评论（“未访问网络服务”）-您是否尝试过更正常/记录在案的方法？

$('#typeahead').typeahead({
  source: function (query, process) {
     return $.get('http://localhost:8732/IngredientsService/search/', { query: query }, function (data) {
       return process(data.options); //if JSON is [ "options" : { ...} 
     });
  }
});

$.getJSON 不是必需的，但当您想要加载整个 JSON 并将其注入一部分作为预输入的源时很有用

$.getJSON("http://localhost:8732/IngredientsService/search/", function(json) {
  $("#typeahead").typeahead({
    source : json.options //again, dont know the structure of the JSON
  });
});
于 2013-05-23T11:43:01.040 回答
0

从我从 typeahead 文档中可以看出，参数对象中的源键无效。

我认为它应该看起来更像这样：

 $('#typeahead').typeahead({
     remote: 'http://localhost:8732/IngredientsService/search/q=%QUERY' 
 });

http://jsfiddle.net/qVjsu/

于 2013-05-23T12:01:41.597 回答
0

使用异步源时最好省略 return 因为 process() 将被触发两次

$('#typeahead').typeahead({
    source: function (query, process) {
        $.getJSON('/search/json/'+ query), function (data) {
            return process(data);
        });
    },
    minLength: 1,
    items: 8
});
于 2013-07-19T11:36:08.370 回答