ajax与json

Vince_Lee · 发表于 2013-1-29 10:37:48

1.ajax请求servlet(picnews.js)

//1定义 var xmlHttp = false; //2，创建 function createXmlHttp() { if(window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else { xmlHttp = new XMLHttpRequest(); } } function getData() { createXmlHttp(); var url = "servlet/FocusNewsServlet"; //打开异步请求 xmlHttp.open("get",url,"true"); //监听异步请求状态 xmlHttp.onreadystatechange = callback; //发送异步请求 xmlHttp.send(); } function callback(){ if(xmlHttp.readyState == 4) { var json = xmlHttp.responseText; var res = eval('('+json+')'); //for(var i in json) // { // alert("picId"+i+"="+res.list[i].picId);//alert:imgUrl2=images/homead/2011060301.jpg // } showFocus(res); } }; function showFocus(res){var focus_width=280;var focus_height=180;var text_height=0;var swf_height=focus_height + 0;var pic1=res.list[2].picUrl;var pics="UploadImages/"+res.list[0].picUrl+"###UploadImages/"+res.list[1].picUrl+"###UploadImages/"+res.list[2].picUrl+"###UploadImages/"+res.list[3].picUrl+"###UploadImages/"+res.list[4].picUrl;var links=res.list[0].picLink+"###"+res.list[1].picLink+"###"+res.list[2].picLink+"###"+res.list[3].picLink+"###"+res.list[4].picLink;var texts=res.list[0].picText+"###"+res.list[1].picText+"###"+res.list[2].picText+"###"+res.list[3].picText+"###"+res.list[4].picText;var descripts=res.list[0].picDescripts+"###"+res.list[1].picDescripts+"###"+res.list[2].picDescripts+"###"+res.list[3].picDescripts+"###"+res.list[4].picDescripts+"";var fo = new SWFObject("swf/pix.swf", "_FocusObj", focus_width, swf_height, "7","F6F8FA");fo.addVariable("pics", pics);fo.addVariable("links", links);fo.addVariable("texts", texts); fo.addVariable("descripts", descripts);fo.addVariable("borderwidth", focus_width);fo.addVariable("borderheight", focus_height);//fo.addVariable("textheight", text_height);fo.addVariable("border_color", "#666"); //fo.addVariable("fontsize", "24"); //fo.addVariable("fontcolor", "FFFFFF");fo.addVariable("is_border", "");fo.addVariable("is_text", "1");fo.addParam("wmode", "opaque");fo.write("FocusObj");}getData();
2.servlet返回json至前端

package com.bc.servlet;import java.io.IOException;import java.io.PrintWriter;import java.util.HashMap;import java.util.List;import java.util.Map;import javax.servlet.RequestDispatcher;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import net.sf.json.JSONObject;import com.bc.bean.AdminSheet;import com.bc.dao.AdminOrclDAO;import com.bc.dao.impl.daoImpl;public class FocusNewsServlet extends HttpServlet {/** * Constructor of the object. */public FocusNewsServlet() {super();}/** * Destruction of the servlet. <br> */public void destroy() {super.destroy(); // Just puts "destroy" string in log// Put your code here}/** * The doGet method of the servlet. <br> * * This method is called when a form has its tag value method equals to get. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {response.setContentType("text/html;charset=UTF-8");PrintWriter out = response.getWriter();AdminOrclDAO dao=new AdminOrclDAO();List list=dao.findAllPicNewsSheet();//request.setAttribute("list", list);//RequestDispatcher requestDispatcher = request.getRequestDispatcher("/Admin/PortalFlashList.jsp");//requestDispatcher.forward(request,response);//String[] adName={};//for (int i = 0; i < list.size(); i++) {//System.out.println(((AdminSheet)(list.get(i))).getAdName());//out.print(((AdminSheet)(list.get(i))).getAdName());//}Map<String,Object> map = new HashMap<String,Object>();//map.put("a", "aaaa");map.put("list",list );JSONObject obj=JSONObject.fromObject(map);//out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");//out.println("<HTML>");//out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>");//out.println(" <BODY>");//out.print("${requestScope.}");//out.print(this.getClass());//out.println(", using the GET method");//out.println(" </BODY>");//out.println(list);out.println(obj);out.flush();out.close();}/** * The doPost method of the servlet. <br> * * This method is called when a form has its tag value method equals to post. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */public void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {response.setContentType("text/html");PrintWriter out = response.getWriter();out.println("...");out.flush();out.close();}/** * Initialization of the servlet. <br> * * @throws ServletException if an error occurs */public void init() throws ServletException {// Put your code here}}
3.js解析json,取出数据

代码已在1,picnews.js内,解析方式:var res = eval('('+json+')');

取值json对象方式为:

res.list[i].picId

		自动登录	找回密码
密码			立即注册