Javascript 在JSON中从MYSQL获取结果并使用它

我对JSON和AJAX完全陌生。我试图从MYSQL查询中获得一个结果，并用result更新一个DIV。我使用的是网上找到的不同的代码片段，可以得到JSON编码的结果，但似乎不能用它做任何事情

从MYSQL获取并以JSON输出的代码或文件名API.php为：

include 'db.php';  
$sth = mysqli_query($con,"SELECT * FROM $tableName");
$rows = array();
while($r = mysqli_fetch_assoc($sth)) {
    $rows[] = $r;
}

 echo json_encode($rows);

这个输出是这样的

[{"user_id":"320326","type":"BUSINESS","business":"Business name","f_name":"DAVE","l_name":"TEST","email":"test@test.com","token":"","l_number":"0","m_number":"","password":"work","joined":"2018-07-06","sms_opt":"","instant_opt":"","instant_id":"","email_opt":"","offers_opt":"]

加载时页面上要更改的HTML为：

<div id="output">this element will be accessed by jquery and this text replaced</div>

jquery将访问此元素并替换此文本

加载它并获取不起任何作用的信息的代码是：

$(function () 
  {
    $.ajax({                                      
      url: 'api.php',                  //the script to call to get data          
      data: "",                        //you can insert url argumnets here to pass to api.php
                                       //for example "id=5&parent=6"
      dataType: 'json',                //data format      
      success: function(data)          //on recieve of reply
      {
        var user_id = data[0];              //get id
        var f_name = data[2];           //get name

        $('#output').html("<b>id: </b>"+user_id+"<b> name: </b>"+f_name); //Set output element html
        //recommend reading up on jquery selectors they are awesome 

      } 
    });
  }); 

$（函数（）
{
$.ajax（{
url:'api.php'，//要调用以获取数据的脚本
数据：“”，//您可以在此处插入url argumnets以传递到api.php
//例如“id=5，父项=6”
数据类型：“json”，//数据格式
成功：函数（数据）//收到回复时
{
var user_id=data[0]；//获取id
var f_name=data[2]；//获取名称
$（'#output'）.html（“id:+user_id+”name:+f_name）；//设置输出元素html
//推荐阅读jquery选择器，它们非常棒
} 
});
}); 

---

理想情况下，我想在点击一个按钮时进行测试，然后相应地使用数据，我不知道哪里出了问题，并且尝试了一些方法，但是很多在线示例太复杂了，从外观上看，这是非常基本的。提前感谢。

由于您收到一系列对象，您必须对其进行迭代：

var success=函数（数据）{
var html=''；
对于（var i=0；iDid）您是否删除了从PHP接收到的部分json？因为您帖子中的json字符串无效。这将在每次迭代时覆盖#输出html，并且IE 11中不支持反勾号，不幸的是，MS仍然支持反勾号，并且至少在windows 10不再受支持之前是如此（除非他们出于某种原因发布了像IE 12这样的新版本）。@Lou，非常感谢您的编辑，对我来说看起来好多了。谢谢您，但我得到了TypeError:data在Object.success（getquotes11:391）在u（jquery.min.js:2）在Object.fireWith[as resolveWith]（jquery.min.js:2）在k（jquery.min.js:2）上无法读取数据在XMLHttpRequest（jquery.min.js:2）中，从DB获取数据并编码为JSON的最佳或最简单的方法是什么？？？@wayneuk2，看起来有输入错误，请查看更新的答案。获取JSON的最简单方法取决于您的环境。MySQL可以从v.5.7返回JSON（如果我记得很清楚的话）。