Question

我试图了解如何使用jquery ajax获取和显示数据。我有一个php页面(data.php)，它成功地从mysql数据库中检索数据并将该数据编码为json数组。客户端我有一个名为get.php的页面。我无法弄清楚为什么我的脚本无法从data.php获取任何数据我在firebug控制台中什么都没有。

data.php

echo json_encode($mydata);
 which outputs:
[  
   {  
      "id":"236",
      "title":"The Jungle Book"
   },
   {  
      "id":"235",
      "title":"The Shallows"
   },
   {  
      "id":"232",
      "title":"For Your Eyes Only"
   },
   {  
      "id":"231",
      "title":"Ice Giants"
   }
]

get.php

<script>
    ("button").click(function(){
      {
        $.ajax({                                      
          url: 'data.php',                       
          data: "",                       
          dataType: 'json',                    
          success: function(data)          
          {
            var id = data[0];             
            var title = data[1];           

            $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+vname);
          } 
        });
      }); 
</script>

    <h3>Output: </h3>
    <button>Get Data</button>

      <div id="output"></div>

Answer 1

<script>
$("button").click(function()
  {
    $.ajax({                                      
      url: 'data.php',                       
      data: "",                       
      dataType: 'json',                    
      success: function(data)          
      {
        var id = data[0];             
        var title = data[1];           
        $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+vname);
      } 
    });
   });

试试这个

Answer 2

你几乎没有错：你没有为按钮指定jquery($) 选择器，你在里面点击功能使用多个括号{ ajax成功您已为id和title分配了完整对象应该是id=data[0]['id']和title=data[0]['title]以及另一个错误没有定义的变量vname。 php更好的json输出你应该在header('Content-Type: application/json');中使用data.php。

试试这个：
的的index.php

<h3>Output: </h3> <button>Get Data</button> <div id="output"></div> <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> <script> $("button").click(function(){ $.ajax({ url: 'data.php', data: "", dataType: 'json', success: function(data){ //console.log(data); var id = data[0].id; var title = data[1].title; $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+title); } }); }); </script>

<强> data.php

<?php header('Content-Type: application/json'); //use header to specify data type //echo json_encode($mydata); // un-comment this line echo '[{"id":"236", "title":"The Jungle Book"}, {"id":"235", "title":"The Shallows"}, {"id":"232", "title":"For Your Eyes Only"}, {"id":"231", "title":"Ice Giants"} ]'; // comment this line ?>

使用jquery ajax获取JSON数据不起作用

2 个答案: