2017-04-17 68 views
0

我想从一个API获取标题,但得到一些错误。这是我第三次使用ajax。 请让我知道我在做错什么。Ajax查询获取JSON数据

这是我的代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Search Movies</title> 
    <style type="text/css"> 
     #movieTemplateContainer div 
     { 
      width:500px; 
      padding: 10px; 
      margin: 10px; 
      border: black solid 1px; 
     } 

    </style> 
</head> 
<body> 
<label>Search Movies:</label> 
<input id="movieName" size="50" /> 
<button id="btnLookup">Lookup</button> 

<div id="movieTemplateContainer"></div> 

    <script id="movieTemplate" type="text/x-jquery-tmpl"> 
<div>  
     <img src="${BoxArt.LargeUrl}" /> 
     <strong>${Name}</strong> 
     </br> 
     <button id="playButton" movieID=${NetflixApiId} onclick="play(this)">Play Now</button> 
     <p> 
     {{html Synopsis}} 
     </p> 
    </div> 
</script> 

    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript" src="jquery.tmpl.js"></script> 
    <script type="text/javascript"> 

    $("#btnLookup").click(function() { 

     // Build OData query 
     var movieName = $("#movieName").val(); 
     var query = "http://netflixroulette.net/api/api.php?" // netflix base url 
     + "title=" + escape(movieName) // top-level resour 

     // Make JSONP call to Netflix 
    $.ajax({ 
      dataType: "jsonp", 
      url: query, 
      jsonpCallback: "callback", 
      success: callback 
      }); 
     }); 

    function callback(result) { 
     // unwrap result 
     var movies = result.d.results; 

     $("#movieTemplateContainer").empty(); 
     $("#movieTemplate").tmpl(movies).appendTo("#movieTemplateContainer"); 
    } 

    </script> 


<script src="http://jsapi.netflix.com/us/api/js/api.js"></script> 


</body> 
</html> 

我用这API

请让我知道我可以修复错误。

+0

*“但是出现一些错误”* ...出现什么错误?请明确点!请花一些时间阅读[问] – charlietfl

+0

Jsonp不是数据类型 – Vivick

+0

@Vivick它肯定是 – charlietfl

回答

0

删除数据类型中的p。 JSONP引用JSON填充。此外它的好做法是包含一个错误功能,以便即使它失败也能看到数据:

$.ajax({ 
      dataType: "json", 
      url: query, 
      jsonpCallback: "callback", 
      success: callback, 
      error: failed 
     }); 
    }); 

    function callback(result) { 
     console.log(result); 
     // unwrap result 
     var movies = result.d.results; 

     $("#movieTemplateContainer").empty(); 
     $("#movieTemplate").tmpl(movies).appendTo("#movieTemplateContainer"); 
    } 

    function failed(xhr, ajaxOptions, thrownError) { 
    alert(xhr.status); 
    alert(thrownError); 
    } 
+0

_“删除数据类型中的p。JSONP指的是JSON填充”_为什么?只有一个参数的错误处理程序不会告诉你任何有用的信息... – Andreas

+0

谢谢它正在工作,但我没有获取Html中的数据。在控制台我越来越。你能帮我解决吗? –

+0

返回的对象具有参数。所以在你的jQuery中它应该显示如下数据: result.director,result.show_cast等 –