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/