1.调用方式
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script>
$(function(){
$.ajax({
url:"bookAction", //请求地址
type:"post", //设置post提交
success:function(data){
//(1)将收到的Json字符串转换成数组对象
var bookArray = eval("("+data+")");
//(2)拼接字符串
var str ="<tr><td>bookid</td><td>bookname</td><td>pinyin</td><td>goryid</td><td>author</td><td>price</td><td>image</td><td>publishing</td><td>bdesc</td><td>state</td><td>tetime</td><td>volume</td>"
//遍历bookArray
$.each(bookArray,function(index,element){
str = str + "<tr><td>"+element.bookid+"</td><td>"+element.bookname+"</td><td>"+element.pinyin+"</td><td>"+element.goryid+"</td><td>"+element.author+"</td><td>"+element.price+"</td><td>"+element.image+"</td><td>"+element.publishing+"</td><td>"+element.bdesc+"</td><td>"+element.state+"</td><td>"+element.tetime+"</td><td>"+element.volume+"</td>"
});
//(3)将拼接好的html字符串放到指定的元素中
$('#tab1').html(str);
//$("table").bgcolor();
},
dateType:"text"
});
});
</script>
</head>
<body>
<table width="100%" border="1" id="tab1">
</table>
</body>
</html>
1.2 JQuery的俩种调用方式
$.get(servlet,data,callback);
$.post(servlet,data,callback);
2.重点是怎样将集合转换成JSON格式 ,怎样将JSON字符串转换成数组对象。
(1)将集合转JSON
//将集合转换成JSON格式 ObjectMapper om = new ObjectMapper(); String bookJson = om.writeValueAsString(bookList);
(2)将数据响应到前端
//ajax流程:响应到前端 PrintWriter out = resp.getWriter(); out.write(bookJson); out.flush(); out.close();
(3)将JSON字符串转数组对象
//(1)将收到的Json字符串转换成数组对象
var bookArray = eval("("+data+")");
3.XML代码拼接,遍历循环
//(2)拼接字符串
var str ="<tr><td>bookid</td><td>bookname</td><td>pinyin</td><td>goryid</td><td>author</td><td>price</td><td>image</td><td>publishing</td><td>bdesc</td><td>state</td><td>tetime</td><td>volume</td>"
//遍历bookArray
$.each(bookArray,function(index,element){
str = str + "<tr><td>"+element.bookid+"</td><td>"+element.bookname+"</td><td>"+element.pinyin+"</td><td>"+element.goryid+"</td><td>"+element.author+"</td><td>"+element.price+"</td><td>"+element.image+"</td><td>"+element.publishing+"</td><td>"+element.bdesc+"</td><td>"+element.state+"</td><td>"+element.tetime+"</td><td>"+element.volume+"</td>"
});
//(3)将拼接好的html字符串放到指定的元素中
$('#tab1').html(str);
},
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- iOS 13 Data Source 新特性:基于 Diffable 实现局部刷新
- 全局变量,静态全局变量,局部变量,静态局部变量
- CSS局部变量
- Java并发 -- 局部变量
- 移动端 - 局部滚动
- golang方法返回局部变量指针
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
ASP.NET 2.0技术内幕
埃斯帕斯托 / 施平安 / 清华大学出版社 / 2006-8 / 68.00元
《ASP.NET2.0技术内幕》围绕着ASP.NET 2.0是Web开发的重要分水岭这一主题,采用自顶向下的方式介绍ASP.NET 2.0的最新编程实践,从更广泛的特征到具体的实现和编程细节,充分展示了ASP.NET的最新编程实践。全书共15章,主题涉及HTTP运行库、安全性、缓存、状态管理、控件、数据绑定和数据访问。 《ASP.NET2.0技术内幕》主题丰富,讲解透彻,包含大量实例,是......一起来看看 《ASP.NET 2.0技术内幕》 这本书的介绍吧!