jQuery autocomplete与烂番茄api

Question

我试图使用自动完成获取从JSON格式的rottentomatoes电影建议。 但下面的代码不显示任何建议。

<script> 
var apikey = "5xq9w7z2mp7a6cnchkfy52yd"; 
var baseUrl = "http://api.rottentomatoes.com/api/public/v1.0"; 

var moviesSearchUrl = baseUrl + '/movies.json?apikey=' + apikey; 
var query = "Rocky"; 

$(document).ready(function() { 
$("#sample").autocomplete({ 
source: function(request, response) { 
     $.ajax({ 
      url: moviesSearchUrl + '&q=' + encodeURI(query), 
      dataType: "jsonp", 
      success: function(data) { 
        var movies = data.movies; 
        response(function(movies) { 
           return { 
             label: movies.title, 
             value: movies.title 
             } 
        }));   
        } 
     }); 
     } 
}); 
}); 
</script> 

对于完整的页面源：https://gist.github.com/2018447 我还需要包括在建议名单的动画缩略图。任何人都可以帮助我吗？

Answer 1

您有一个语法错误（额外的)），并且错过了调用以迭代movies数组（通常使用$.map()）。

这是它应该是什么样子（更新：包括海报缩略图）

$("#sample").autocomplete({ 
    source: function(request, response) { 
     $.ajax("http://api.rottentomatoes.com/api/public/v1.0/movies.json", { 
      data: { 
       apikey: apikey, 
       q: request.term 
      }, 
      dataType: "jsonp", 
      success: function(data) { 
       response($.map(data.movies, function(movie) { 
        return { 
         label: movie.title, 
         value: movie.title, 
         thumb: movie.posters.thumbnail 
        } 
       }));   
      } 
     }); 
    } 
}).data("autocomplete")._renderItem = function(ul, item) { 
    var img = $("<img>").attr("src", item.thumb); 
    var link = $("<a>").text(item.label).prepend(img); 
    return $("<li>") 
     .data("item.autocomplete", item) 
     .append(link) 
     .appendTo(ul); 
}; 
​ 

在这里工作的例子 - http://jsfiddle.net/df7tp/6/