<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="button" id="btn" value="获取">
<div id="box"></div>
</body>
<script src="js/jquery-1.11.3.min.js"></script>
<script>
$("#btn").click(function(){
// var val=$(this).val();
// console.log(val);
$.ajax({
//type,url,data,datatype,success/error;
type:"get",//请求类型
url:"json/json.txt",
timeout:300,//请求时间.如果超时就算失败
data:{
// value:val
},//发送给后台的数据,后台会根据你的请求给你传对应的数据
dataType:"JSON",//如果后台给你的数据格式不是你想要的,会自动转成json
beforeSend:function(xhr){
console.log("请求发送出去之前")
},
complete:function(xhr,textStatus){
//请求发送出去了.不管有没有成功
//xhr ajax对象
//textStatus 请求状态
console.log("请求发送成功")
},
success:function(data,textStatus){
//请求成功执行的函数
//data服务器返回的数据
//textStatus 请求的状态
console.log(data);
var str="";
$.each(data,function(index,item){
str+="<ul><li>"+item['name']+"</li><p>"+item["say"]+"</p></ul>"
});
$("#box").html(str);
},
error:function(xhr,textStatus,errThrown){
//xhr ajax对象
//textStatus 请求的状态
//errThrown 错误的信息
}
})
})
</script>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="button" id="btn" value="获取">
<div id="box"></div>
</body>
<script src="js/jquery-1.11.3.min.js"></script>
<script>
$("#btn").click(function(){
// var val=$(this).val();
// console.log(val);
$.ajax({
//type,url,data,datatype,success/error;
type:"get",//请求类型
url:"json/json.txt",
timeout:300,//请求时间.如果超时就算失败
data:{
// value:val
},//发送给后台的数据,后台会根据你的请求给你传对应的数据
dataType:"JSON",//如果后台给你的数据格式不是你想要的,会自动转成json
beforeSend:function(xhr){
console.log("请求发送出去之前")
},
complete:function(xhr,textStatus){
//请求发送出去了.不管有没有成功
//xhr ajax对象
//textStatus 请求状态
console.log("请求发送成功")
},
success:function(data,textStatus){
//请求成功执行的函数
//data服务器返回的数据
//textStatus 请求的状态
console.log(data);
var str="";
$.each(data,function(index,item){
str+="<ul><li>"+item['name']+"</li><p>"+item["say"]+"</p></ul>"
});
$("#box").html(str);
},
error:function(xhr,textStatus,errThrown){
//xhr ajax对象
//textStatus 请求的状态
//errThrown 错误的信息
}
})
})
</script>
</html>