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>
分享到：
相关推荐
标题中的“前台是个什么东西---JQ&JS---一个排班的程序(JAVASWT改版)”指的是一个关于前端开发的项目，重点在于使用JavaScript（JS）和jQuery（JQ）来实现一个排班管理程序。这个程序可能是从原本用Java SWT...
标题中的"spring框架项目+jQueryAjax提交实例"指的是一个整合了Spring框架和jQuery AJAX技术的Web应用程序项目。这个项目提供了一个完整的流程，演示了如何在前端使用jQuery的AJAX功能向后端Spring MVC控制器发送...
"ASP.NET基于Ajax和jQuery-UI实现进度条" 本文将详细介绍如何使用ASP.NET、Ajax和jQuery-UI实现进度条功能。进度条是指在服务器端执行任务时，客户端实时显示任务的进度情况，以增强用户体验。 一、前台实现 在...
在描述中提到的"jquery ajax json 跨域不解释,代码很简单"，我们可以从以下几个关键点理解： 1. **jQuery的Ajax设置**：在使用Ajax进行跨域请求时，我们需要在`$.ajax()`方法中设置`dataType: 'jsonp'`。这告诉...
首先，`Jquery`是一个流行的JavaScript库，它简化了DOM操作、事件处理、动画效果以及异步数据交互等任务。在登录验证场景中，Jquery可以用于监听用户输入、执行表单验证以及发起Ajax请求。 `Ajax`（Asynchronous ...
jQuery的`.ajax()`方法提供了一种简单的方式来实现这个功能： ```javascript $.ajax({ type: "POST", // 请求类型，可以是GET、POST等 url: "your-backend-url", // 后台接口URL data: { key1: "value1", key2: ...
jQuery是一个流行的JavaScript库，它简化了DOM操作、事件处理和AJAX交互等任务。而ASHX（HttpHandler）是ASP.NET中处理HTTP请求的一种轻量级方式，可以用于接收和响应数据。现在，我们来详细探讨如何利用这些技术...
首先，JQuery是一个轻量级、功能丰富的JavaScript库，它简化了DOM操作、事件处理、动画效果以及Ajax交互。在AJAX（Asynchronous JavaScript and XML）技术中，JQuery提供了一套简单易用的API，使得前端能够发起HTTP...
"jQuery前台模板demo"就是这样一个实用的工具，它结合了jQuery的强大功能和易用性，为前端设计提供了一套便捷的解决方案。 **一、jQuery简介** jQuery是一款高效、简洁的JavaScript库，它简化了HTML文档遍历、事件...
首先，jQuery是一个轻量级的JavaScript库，它简化了HTML文档遍历、事件处理、动画和Ajax交互等任务。在jQuery中实现分页，我们通常会借助于插件，这里提到的是一个专为jQuery设计的前端分页插件。 这个插件的主要...
jQuery使得JavaScript编程变得更加简单，尤其在处理DOM操作、事件和Ajax请求时。在本示例中，jQuery将用于发起Ajax请求，接收并解析JSON数据，然后在页面上以表格形式展示这些数据，实现局部刷新。 **Ajax与jQuery...
首先，jQuery是一个轻量级的JavaScript库，它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互。jQuery的核心特性是其简洁的API，使得开发者可以编写更少的代码来完成更多的功能。 1. jQuery的$....
在"简单Ajax实例"中，前端部分通常使用JavaScript或jQuery库来创建和发送Ajax请求。例如，当用户在输入框中更改商品数量时，JavaScript会监听这个事件，并调用Ajax函数。函数内部会构造一个HTTP请求，包含商品ID和新...
在"经典前台技术AJAX"中，我们可以看到几个关键的应用示例： 1. **聊天室例子**：使用AJAX可以构建实时的在线聊天室。当用户输入消息并点击发送时，AJAX会向服务器发送请求，将新消息存储在数据库中，然后服务器...
在“jquery项目前台js”这个主题中，我们主要探讨的是如何使用jQuery库和其他JavaScript框架来构建前端交互式网页。jQuery是一个高效、简洁且易用的JavaScript库，它极大地简化了DOM操作、事件处理、动画效果以及...
总结，"AJax Jquery实现的动态树实例"是前端开发中的一个重要实践，它结合了Ajax的异步通信能力和Jquery的便利性，创建出交互性强、功能丰富的动态树结构。通过对压缩包中的源代码学习，开发者可以掌握如何根据实际...
在前端开发中，jQuery是一个非常流行和广泛使用的JavaScript库，它极大地简化了DOM操作、事件处理、动画制作以及Ajax交互。在这个"jquery前台logo页面"项目中，我们可以深入理解jQuery如何用于创建动态和互动的用户...
本项目"基于JQuery的Banner漂亮的前台页面"正是这样一个旨在实现独特视觉效果的示例，它利用了JQuery的Banner插件来创建一个具有撕裂效果的图片滚动展示。这个效果使图片看起来像是被动态地撕开，增加了页面的互动性...
通过这种方式，可以在页面后台定义可被前台JavaScript通过Ajax调用的方法。通常这些方法会被定义在.asmx文件或者在***的页面后台代码中。 5. Jquery处理返回数据：在Jquery Ajax请求的回调函数中，可以对服务器返回...
jQuery是一个快速、简洁的JavaScript库，能够简化HTML文档遍历、事件处理、动画和Ajax交互。它的核心功能包括选择器（用于选取DOM元素）、DOM操作（如添加、删除或修改元素）、事件处理和动画效果。 购物车功能通常...