1. 首先 ajax在調試時的 type,url等都是顯示未定義，如果success之後 取數據未 undefined,則考慮是取數據的位置不對（考慮數組）
2. console.log（） ，console.log(typeof data) 方法在調試的時候會有用，可以打印出想要的數據樣式
3. json數組樣式
<!DOCTYPE html>
<html lang="en" meta charset="UTF-8">
<head>
<meta charset="UTF-8">
<title>ajax</title>
<style>
* {
margin: 0;
padding: 0px;
font-size: 12px;
}
a {
text-decoration: none;
}
ul {
list-style: none;
}
#box {
width: 500px;
margin: 20px auto;
}
.btn {
display: block;
width: 50px;
height: 50px;
margin: 20px auto;
line-height: 50px;
text-align: center;
border: 1px #000 solid;
color: #000;
transition: .3s linear;
}
.btn:hover {
background: #000;
color: #fff;
font-weight: bold;
}
#con {
margin-top: 20px;
}
#con option {
line-height: 30px;
text-align: center;
}
</style>
<script src="Scripts/jquery-3.4.1.min.js"></script>
<script>
$(function () {
$('.btn').click(function () {
$.ajax({
type: "GET", //請求的方式，也有POST請求
//url: "data.json", //請求地址，後臺提供的,這裏我在本地自己建立了個json的文件做例子
url: "api/values",
dataType: "json", //json格式，後臺返回的數據爲json格式的。
success: function (data) {
console.log(data.Name);
var dataObj = data
; //返回的result爲json格式的數據
console.log(dataObj);
con = "";
$.each(dataObj, function (index, item) {
con += "<option>姓名：" + index +item.Name + "</option>";
con += "<option>性別：" + item.sex + "</option>";
con += "<option>現居地：" + item.address + "</option>";
con += "<option>崗位：" + item.job + "</option>";
});
console.log(con); //可以在控制檯打印一下看看，這是拼起來的標籤和數據
$("#con").html(con); //把內容入到這個div中即完成
}
})
})
})
</script>
</head>
<body>
<div id="box">
<a class="btn" href="javascript:;">點擊</a>
<select id="con" size="30"></select>
</div>
</body>
</html>
public class ValuesController : ApiController
{
// GET api/values
public HttpResponseMessage Get()
{
//初始化測試對象
TestJsonObj t = new TestJsonObj();
t.Name = "中";
t.Address = "GZ";
TestJsonObj t2 = new TestJsonObj();
t2.Name = "中";
t2.Address = "GZ11";
List<TestJsonObj> list = new List<TestJsonObj>
{
t,t2
};
//OBJ轉化成JSON
string json = JsonConvert.SerializeObject(list);
//返回json數
return new HttpResponseMessage()
{
Content = new StringContent(json, Encoding.UTF8, "application/json"),
};
}
}
[
{
"name": "小明",
"sex": "M",
"address": "北京",
"job": "web前端工程師"
}
]