关于前端ajax请求获取数据成功之后无法操作数据的原因及解决方法

前言：做项目的时候我用ajax请求json数据，遍历使用数据时却发现页面无响应。关于这个问题今天有个朋友又问了我一次，记录一下。由于我没有记录，这里用我朋友的图片。

代码现象：

• 

  这里他是使用alert弹出ajax接收到的数据，个人建议在js代码中使用console.log(数据)在控制台打印，更方便看出后端返回的json数据类型（字符串or数组等）。

思考过程：

• 当时初次接触ajax和json概念，于是直接百度。

解决方案：

• 查过网上有很多方法，基本原理都是因为后端返回的json数据是字符串，而我们在操作json数据时需要把他转换成数组对象。或者在后端返回数组格式的数据。我这里使用的方法很简单，亲测万能。代码如下。js代码块中将返回的数据用eval包起来，再定义一个变量接收即可。重点在行15。然后你就可以肆意操纵你的数据啦。补充：eval()有代码注入的危险，除此之外，我们还可以使用JSON.parse()。

•  1 $.ajax({
   2             type: 'GET',
   3             url: 'https://localhost:44369/UserInfo/EditUserJson',//请求数据
   4             data: json,//传递数据
   5             //dataType:'json/text',//预计服务器返回的类型
   6             timeout: 3000,//请求超时的时间
   7             //回调函数传参
   8             success: succFunction,
   9         })
  10         function succFunction(data) {
  11             //$("#list").html('');
  12
  13             console.log(data)
  14             //转换成数组
  15             var jsons = eval('(' + data + ')');
  16             console.log(jsons);
  17             //console.log(data);
  18             for (var i in jsons) {
  19                 name = jsons[i].Name
  20                 console.log(name)
  21                 password = jsons[i].Password
  22                 //console.log(password)
  23                 rname = jsons[i].Rname
  24                 sex = jsons[i].Gender
  25                 phone = jsons[i].Phone
  26                 qq = jsons[i].Qq
  27                 email = jsons[i].Email
  28                 desc = jsons[i].Desciption
  29                 group = jsons[i].Gid
  30                 status = jsons[i].Status
  31             }
  32     });