2012-08-06 93 views
0

我试图显示,看起来像这样JSON数据:如何从JQuery的的getJSON提取JSON对象数据

{ 
    "response": { 
     "@attributes": { 
      "status": "ok", 
      "version": "12" 
     }, 
     "label": { 
      "@attributes": { 
       "plid": "1234", 
       "name": "demo" 
      } 
     }, 
     "page": { 
      "@attributes": { 
       "name": "bookinfo" 
      }, 
      "count": 1, 
      "pages": "144", 
      "current_page": 1, 
      "isbn10": "0824828917", 
      "isbn13": "9780824828912", 
      "title": "Surf Science", 
      "author": "Tony Butt - Paul Russell - Rick Grigg", 
      "binding": "Paperback", 
      "msrp": 34, 
      "publisher": "University of Hawaii Press", 
      "published_date": "2004-07-01", 
      "edition": "2nd", 
      "rank": 176243, 
      "rating": 0, 
      "_amazon_item": null, 
      "image": "http:\/\/ecx.images-amazon.com\/images\/I\/51-dKe7tztL._SL75_.jpg" 
     } 
    } 
}​ 

我知道的JQuery调用.getJSON可以用来得到类似上面一个对象,但我不知道如何从中提取数据,所以我可以在网页上动态显示它。有关如何使用JQuery/Javascript做到这一点的任何想法?例如,我将如何获得作者或标题?

我下面的代码(唯一的区别是,当我测试它实际上我用我的真正的关键):

<!DOCTYPE html> 
    <html lang="en-US"> 
    <head> 
     <meta charset="UTF-8"> 
     <script src="http://code.jquery.com/jquery-latest.js"></script> 
    </head> 
    <body> 

    <script type="text/javascript"> 

    $.ajax({ 
     type: "GET", 
     url: "http://api2.campusbooks.com/12/rest/search", 
     dataType: "json", 
     data: { 
     key : "[my_key]", 
     keywords : "calc", 
     timeout : "7", 
     format : "json" 
     }, 
     success: function(jsonData) { 
     console.log("Success! " + jsonData); 
     }, 
     error: function(jsonData) { 
     console.log("Error! " + jsonData); 
     } 
    }); 
     </script> 

    </body> 
    </html> 

在Firebug控制台什么版画是:

Error! [object Object] 

所以对象是返回的只是[object Object]。 “错误!”部分来自我的代码。当我把所有的变量为1个网址并进入它,然后页面显示是:使用

{"response":{"@attributes":{"status":"ok","version":"12"},"label":{"@attributes":{"plid":"[1234]","name":"[my_name]"}},"page":{"@attributes":{"name":"search"},"count":1000,"pages":100,"current_page":1,"results":{"book":[{"isbn10":"0538497394","isbn13":"9780538497398","title":"Essential Calculus: Early Transcendentals, Enhanced Edition (with Enhanced WebAssign with eBook Printed Access Card for Multi Term Math and Science)","author":"James Stewart","binding":"Hardcover","msrp":177.95,"pages":"944","publisher":"Brooks Cole","published_date":"2010-01-01","edition":"1","rank":12133,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/41%2Bk0odfWaL._SL75_.jpg"},{"isbn10":"1439058474","isbn13":"9781439058473","title":"Dosage Calculations (Available Titles 321 Calc!dosage Calculations Online)","author":"Gloria D. Pickar - Amy Pickar-Abernethy","binding":"Paperback","msrp":90.95,"pages":"720","publisher":"Delmar Cengage Learning","published_date":"2012-01-01","edition":"9","rank":2004,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/41TcBjzhPnL._SL75_.jpg"},{"isbn10":"0840065639","isbn13":"9780840065636","title":"Applied CALC (with Mathematics CourseMate with eBook Printed Access Card)","author":"Frank Wilson","binding":"Paperback","msrp":83.95,"pages":"256","publisher":"Brooks Cole","published_date":"2011-01-01","edition":"1","rank":514542,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/516p3a40S4L._SL75_.jpg"},{"isbn10":"1430231599","isbn13":"9781430231592","title":"Beginning OpenOffice Calc: From Setting Up Simple Spreadsheets to Business Forecasting","author":"Jacek Artymiak","binding":"Paperback","msrp":39.99,"pages":"136","publisher":"Apress","published_date":"2011-09-05","edition":"1","rank":682980,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/51FFF95bq4L._SL75_.jpg"},{"isbn10":"0071488456","isbn13":"9780071488457","title":"Bob Miller's High School Calc for the Clueless - Honors and AP Calculus AB & BC (Bob Miller's Clueless Series)","author":"Bob Miller","binding":"Paperback","msrp":12.95,"pages":"246","publisher":"McGraw-Hill","published_date":"2007-08-14","edition":"1","rank":1121409,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/51Adl-dr0cL._SL75_.jpg"},{"isbn10":"0821848178","isbn13":"9780821848173","title":"Riot at the Calc Exam and Other Mathematically Bent Stories","author":"Colin Adams","binding":"Paperback","msrp":32,"pages":"271","publisher":"American Mathematical Society","published_date":"2009-07-21","edition":"","rank":625803,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/51Jvoh2ZQtL._SL75_.jpg"},{"isbn10":"111816170X","isbn13":"9781118161708","title":"Calculus II For Dummies","author":"Mark Zegarelli","binding":"Paperback","msrp":19.99,"pages":"384","publisher":"For Dummies","published_date":"2012-01-24","edition":"2","rank":16179,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/51W8PJsg%2BZL._SL75_.jpg"},{"isbn10":"1847190979","isbn13":"9781847190970","title":"Learn OpenOffice.org Spreadsheet Macro Programming: OOoBasic and Calc automation: A fast and friendly tutorial to writing macros and spreadsheet applications","author":"Dr Mark Alexander Bain","binding":"Paperback","msrp":39.99,"pages":"220","publisher":"Packt Publishing","published_date":"2006-12-22","edition":"","rank":1118193,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/51SOipRUqOL._SL75_.jpg"},{"isbn10":"0495014281","isbn13":"9780495014287","title":"Essential Calculus: Early Transcendentals (Stewart's Calculus Series)","author":"James Stewart","binding":"Hardcover","msrp":190.95,"pages":"912","publisher":"Brooks Cole","published_date":"2006-03-01","edition":"1","rank":1392,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/41T-md-t%2B6L._SL75_.jpg"},{"isbn10":"0764146939","isbn13":"9780764146930","title":"Barron's AP Calculus, 11th Edition","author":"David Bock M.S. - Shirley O. Hockett M.A.","binding":"Paperback","msrp":18.99,"pages":"696","publisher":"Barron's Educational Series","published_date":"2012-02-01","edition":"11","rank":3475,"rating":0,"image":"http:\/\/ecx.images-amazon.com\/images\/I\/51GENtM0pGL._SL75_.jpg"}]}}}} 

网址:

http://api2.campusbooks.com/12/rest/search?key=[my_key]&keywords=calc&timeout=7&format=json 
+1

MDN JavaScript指南有关于使用对象的整个部分:https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Working_with_Objects – 2012-08-06 22:21:59

+0

解析时,您有一个对象结构。对象的属性访问是'object.property'或'object [“property”]'...后者为非有效标识字符提供了更多的灵活性,如'@'。 – 2012-08-06 22:29:40

+1

其他资源:http://api.jquery.com/jQuery.getJSON/ – Nope 2012-08-06 22:42:36

回答

3

假设JSON返回为您呈现,这里是一个例子:

$.getJSON("some/URL", function(jsonData) { 
    $("#titleDiv").html(jsonData.response.page.title); 
    // #titleDiv now holds the text "Surf Science" 

    // another way 
    $("#authorDiv").html(jsonData["response"]["page"]["author"]); 
    // #authorDiv now holds the text "Tony Butt - Paul Russell - Rick Grigg" 
}); 

也许有更好的方式来做到这一点是使用$.ajax,因为这就是jQuery的幕后使用反正。你可以指定一个成功和错误处理功能,这将有调试任何问题,帮助这种方式,你可以有:

$.ajax({ 
    type: "GET", 
    url: "http://api2.campusbooks.com/12/rest/bookinfo", 
    dataType: "json", 
    data: { 
    key : "[yourkey]", 
    isbn : "0538497815", 
    timeout : "6", 
    format : "json" 
    }, 
    success: function(jsonData) { 
    console.log("Success! " + jsonData); 
    }, 
    error: function(request, status, error) { 
    console.log("Error! " + request.responseText); 
    } 
}); 

如果出现错误,你应该能够找出它是通过查看浏览器的什么JavaScript控制台。 顺便说一句,您可以按照上面的方法指定参数,而不是将它们放入URL中。

还有一些开发者工具可用于帮助解决这类问题,例如Google Chrome的REST Console app或Firefox的RESTClient add-in。他们可以很容易地输入您的请求参数并确定可能导致问题的原因。

+0

我理解你的代码,但它似乎并没有工作......有没有办法检查我是否收回任何数据呢? – cbr0wn 2012-08-07 03:06:07

+0

确保你用正确的URL替换“some/URL”,然后在回调函数中加入类似下面的内容:“alert('JSON returned!');”如果你收回任何数据,你会得到一个弹出警报。你也可以添加一个“console.log(jsonData);”在函数中将JSON对象输出到浏览器的JavaScript控制台。这将允许您查看返回的JSON的确切格式。 – 2012-08-07 04:17:41

+0

好,所以这是问题所在。似乎没有数据被返回。我使用的是campusbooks.com的url,他们的“API是通过标准REST格式的HTTP GET请求实现的”。我使用的网址类似于http://api2.campusbooks.com/12/rest/bookinfo?key=[mykey]&isbn=0538497815&timeout=6&format=json,[mykey]替换为我的实际密钥。它看起来像我做错了什么? – cbr0wn 2012-08-07 09:55:25