<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>$.ajax()</title>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
//点击按钮异步加载数据，并在content中显示
$("#btn").click(function(){
// $.ajax()方法
$.ajax({
url: "data.json",//"发送的请求地址",
type:"get",//"请求方式"
data:null,//"要发送的数据",
dataType: "json",
beforeSend: function(data) { // 发送请求前执行的代码
$(".loading").show();
},
success: function(data) {// 发送成功后执行的代码
dealData(data);
},
complete:function(){
$(".loading").hide();
},
error: function(XMLHttpRequest, textStatus, errorThrown) {// 请求失败执行的代码
alert("错误信息:"+textStatus);
}
});
// $.getJSON()方法
// $.getJSON("data.json",function(data){
// dealData(data);
// })
//
// /**** $.get()方法 ****/
// $.get("data.json",{},function(data){
// dealData(data);
// },"json");
//
// /**** $.post()方法 ****/
// $.post("data.json",{},function(data){
// dealData(data);
// },"json")
});
function dealData(data){
if(typeof data != "undefined"){
$(data.news).each(function(i){
$("#newsList").append("<li><a href='#id="+data.news[i].id+"'>"+data.news[i].title+"["+data.news[i].date+"]</a></li>")
});
}
}
});
</script>
</head>
<body>
<div id="newsBox">
<div>新闻列表</div>
<ul id="newsList">
<li><a href="#">新闻标题1[11-27]</a></li></li>
<li><a href="#">新闻标题2[11-23]</a></li></li>
<li><a href="#">新闻标题3[11-23]</a></li></li>
<li><a href="#">新闻标题4[11-18]</a></li></li>
<li><a href="#">新闻标题5[11-11]</a></li></li>
<li class="loading hidden" style="display: none">loading..</li>
</ul>
<div id="btn">查看更多</div>
</div>
</body>
</html>上面的代码哪里错了啊，jquery和json的路径都是对的。但网页点击就报错
添加回答
举报
0/150
提交
取消