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

JSON数据格式以及与后台交互数据转换实例

2013-10-14 10:29 736 查看

/*

作者：烟大阳仔

时间：20131013

介绍:主要了解一下json的格式，看看数据是怎么存储的
*/

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript"> /* class person { Integer id; String name; } Person p=new Person(); */ //jason格式标识一个对象 var people={"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}; //alert(people.firstName); //json标识多个人 var people2= [ {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"} ] //alert(people2[1].firstName); //别名： var people3={"person": [ {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"} ] } //alert(people3.person[1].firstName); var people3={ "person1": [ {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"} ], "person2": [ {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"} ], "person3": [ {"firstName":"wy","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"}, {"firstName":"zhangsan","lastName":"hao","email":"1221@qq.com"} ] } //alert(people3.person3[0].firstName); </script> </head> <body>

</body> </html>

-------------------------------------------------------------------------------------------------------------
/*

作者：烟大阳仔

时间：20131013

介绍:主要了学习一下json与后台交互的时候数据的转换
*/

<!DOCTYPE html> <html> <head> <title>json2.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8">  <script type="text/javascript"> function ajaxFunction() { var xmlHttp=null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) {

// Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) {

try { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("您的浏览器不支持AJAX！"); return false; } } } return xmlHttp; } window.onload=function() { document.getElementById("sub").onclick=function() { var xmlReq=ajaxFunction(); xmlReq.onreadystatechange=function() { if(xmlReq.readyState==4) { if(xmlReq.status==200||xmlReq.status==304) { var data=xmlReq.responseText; //{pid:1,pname:'山东省'} //alert(data); var dataObj=eval("("+data+")"); //alert(dataObj); //alert(dataObj.pname); for(var i=0;i<dataObj.length;i++) { alert(dataObj[i].id+" "+dataObj[i].addre); } } } } xmlReq.open("post","../jsonServlet?timeStamp="+new Date().getTime(),true); xmlReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //alert("adsada"); /* * 3.发送数据 * */ xmlReq.send("b=0"); } } </script> </head> <body> <input type="submit" value="提交" name="sub" id="sub"/> <select id="province" name="province"> <option value="">请选择...</option> </select> </body> </html>

package cn.com.Demo;

import java.io.IOException; import java.io.PrintWriter; import java.util.ArrayList; import java.util.List;

import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray; import net.sf.json.JsonConfig;

import cn.com.bean.Province;

public class jsonServlet extends HttpServlet {

public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8"); response.setContentType("text/html; charset=utf-8"); PrintWriter out=response.getWriter(); System.out.println("---------------Post-----------------------"); System.out.println(request.getParameter("b")); //out.write("你好！"); //一个省份的时候 //String str2="{pid:1,pname:'山东省'}"; //out.write(str2); //多个省份的时候 //String str="[{pid:1,pname:'山东省'},{pid:2,pname:'四川'},{pid:3,pname:'北京'},{pid:4,pname:'上海'}]"; //out.write(str); // List<Province> list=new ArrayList<Province>(); Province p1=new Province(1,"山东"); Province p2=new Province(2,"北京"); Province p3=new Province(3,"上海"); list.add(p1); list.add(p2); list.add(p3); JsonConfig config=new JsonConfig(); config.setExcludes(new String[]{"id"}); JSONArray jsonArray=JSONArray.fromObject(list,config); out.write(jsonArray.toString()); System.out.println(jsonArray.toString()); }

}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航