试图从json获取数据

时间:2016-11-17 07:05:07

标签: javascript html json web

我会尝试从url json获取数据,但没有任何附加内容 这是我的代码简单:

    <html>
    <head>
    <title>The jQuery Example</title>
    <script type = "text/javascript" 
    src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type = "text/javascript" language = "javascript">
                 $(document).ready(function() {
                    $("#driver").click(function(event){
                       $.getJSON('http://api.walmartlabs.com/v1/items/54732749?format=json&apiKey=fc5cku3vruymkhxhvtenm9bk', function(jd) {
                          $('#stage').html('<p> Name: ' + jd.item.name + '</p>');
                          $('#stage').append('<p>Age : ' + jd.item.itemId+ '</p>');
                          $('#stage').append('<p> Sex: ' + jd.item.salePrice+ '</p>');
                       });
                    });
                 });
              </script>
           </head>
           <body>
              <p>Click on the button to load result.html file:</p>
              <div id = "stage" style = "background-color:#cc0;">
                 STAGE
              </div>
              <input type = "button" id = "driver" value = "Load Data" />
   </body>
   </html>
有些人可以知道为什么我什么也看不见?

2 个答案:

答案 0 :(得分:2)

您的数据未包含在您需要直接访问的item对象中。

<script type = "text/javascript" language = "javascript">
         $(document).ready(function() {
            $("#driver").click(function(event){
               $.getJSON('http://api.walmartlabs.com/v1/items/54732749?format=json&apiKey=fc5cku3vruymkhxhvtenm9bk', function(jd) {
                  $('#stage').html('<p> Name: ' + jd.name + '</p>');
                  $('#stage').append('<p>Age : ' + jd.itemId+ '</p>');
                  $('#stage').append('<p> Sex: ' + jd.salePrice+ '</p>');
               });
            });
         });
      </script>

答案 1 :(得分:0)

问题在于跨域请求。 您可以使用memory_limit = 64M upload_max_filesize = 64M post_max_size = 64M file_uploads = On max_execution_time = 300 创建一个ajax来解决您的问题。

查看here以获得更好的解释。

注意

如前所述,您应该在没有dataType: "jsonp"的情况下访问您的回复数据,因此.item成为jd.item.name

jd.name
$(document).ready(function() {
  $("#driver").click(function(event) {
    $.ajax({
      url: 'http://api.walmartlabs.com/v1/items/54732749',
      data: {
        format: 'json',
        apiKey: 'fc5cku3vruymkhxhvtenm9bk'
      },
      dataType: 'jsonp',
      success: function(jd) {
        console.log(jd);
        $('#stage').html('<p> Name: ' + jd.name + '</p>');
        $('#stage').append('<p>Age : ' + jd.itemId + '</p>');
        $('#stage').append('<p> Sex: ' + jd.salePrice + '</p>');
      }
    });
  });
});