前台是个什么东西---JavaScript---JQuery简单测试ajax -

metallica_1860

浏览: 32330 次
性别:
来自: 天津

最近访客更多访客>>

Gin_Scotch

caiyuanmao

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

前台是个什么东西---JavaScript---JQuery简单测试ajax

博客分类：

前端技术

Ajax JavaScript jQuery Servlet Bean

jQuery的ajax有很多中实现方式,这里我只用post方法做个测试.

package bean;

import org.json.JSONArray;
import org.json.JSONObject;
/**
 * 
 * @author <a href="mailto:zhangjun@pegasus-se.com">ZhangJun</a>
 * @date 2010/05/14
 */
public class Bean {

	private String name;
	private int age;
	private int array[];

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public int getAge() {
		return age;
	}

	public void setAge(int age) {
		this.age = age;
	}

	public int[] getArray() {
		return array;
	}

	public void setArray(int[] array) {
		this.array = array;
	}

	public JSONObject toJson() {
		JSONObject obj;
		try {
			obj = new JSONObject();
			obj.put("name", this.name);
			obj.put("age", this.age);
			JSONArray array = new JSONArray(this.array);
			obj.put("array", array);

		} catch (Exception e) {
			e.printStackTrace();
			return null;
		}
		return obj;

	}

}

package servlet;

import java.io.IOException;
import java.io.PrintWriter;

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

import bean.Bean;

/**
 * 
 * @author <a href="mailto:zhangjun@pegasus-se.com">ZhangJun</a>
 * @date 2010/05/14
 */
public class JSonServlet extends HttpServlet {

	private static final long serialVersionUID = 6967525879360299810L;

	@Override
	protected void doGet(HttpServletRequest request,
			HttpServletResponse response) throws ServletException, IOException {
		this.doGet(request, response);
	}

	@Override
	protected void doPost(HttpServletRequest request,
			HttpServletResponse response) throws ServletException, IOException {
		Bean b = new Bean();
		b.setAge(23);
		b.setName("syunko");
		int[] array = { 1, 2, 3, 4 };
		b.setArray(array);

		String str = (String) request.getParameter("text");
		System.out.println(str);
		PrintWriter out = response.getWriter();
		String data = b.toJson().toString();
		out.print(data);
		System.out.println(data);
		out.flush();
	}
}

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Insert title here</title>
<script src="jQuery14.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$("#buttonid").click(function() {
			var t = $("#textid").val()
			$.post("test", {
				text : t
			}, function(data) {
				var name = data.name;
				var age = data.age;
				var array = data.array;
				$("#result").html("名前 : "+name+"<br/>"+"年齢 : "+age+"<br/>"+"出来る事 : "+array);
			}, "json");
		})
	})
</script>
</head>
<body>
<input type="text" id="textid" value="default" />
<input type="button" value="クリックしてください" id="buttonid" />
<div id="result"></div>
</body>
</html>

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:javaee="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
  <display-name>jqajax</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  
  <servlet>
    <servlet-name>JSonServlet</servlet-name>
    <servlet-class>servlet.JSonServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>JSonServlet</servlet-name>
    <url-pattern>/test</url-pattern>
  </servlet-mapping>
</web-app>

分享到：

前台是个什么东西---JQuery---导航菜单 | transient

2010-05-14 15:11
浏览 911
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

前台是个什么东西---JavaScript---JQuery简单测试ajax

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

前台是个什么东西---JavaScript---JQuery简单测试ajax

评论

发表评论

相关推荐

前台是个什么东西---JavaScript---一个验证码的小程序

前台是个什么东西---JQ&JS---一个排班的程序(JAVASWT改版)

前台是个什么东西---JavaScript---站在CSDN的肩膀上-->页面上的滚动广告图

前台是个什么东西---JavaScript---页面上的"今天是X年X月X日"

前台是个什么东西---JQuery---几种控制div的UI操作

前台是个什么东西---JQuery---导航菜单

前台是个什么东西---JavaScript---JS面向对象

前台是个什么东西---JavaScript---执行

前台是个什么东西---JavaScript语法集锦

最近访客更多访客>>