您的位置：首页 > Web前端 > JQuery

jquery + ajax 局部刷新

2016-04-15 14:14 661 查看 
//这是html清单
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div class="info">
<p>这是我的名字</p>
<p>这是我的年纪</p>
</div>
<button class="btn">获取我的信息</button>
<script type="text/javascript" src="js/jquery-1.7.min.js"></script>
<script type="text/javascript">
$(function(){
$(".btn").click(function(){
var innerHTML = "";
$.ajax({
type:"get",
url:"data2.json",
dataType:"json",
async:true,
success:function(data){
$.each(data, function(index,element) {
innerHTML = "<p>" + data[index].name + "</p>" + "<p>" + data[index].age + "</p>"
})
$(".info").html(innerHTML);
},
error:function(){
console.log("出现错误了");
}
})
})
})
</script>
</body>
</html>


//json

[
{"name":"i'm rudy","age":"28"}
]
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  jquery ajax 局部刷新
相关文章推荐
新的分享
章节导航