需要jquery插件
1 ajax提交 页面准备
<%@page import="javax.xml.ws.RequestWrapper"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<% String basePath = request.getScheme()+"://"+ request.getServerName()+":"+request.getLocalPort()+request.getContextPath(); %>
<%=basePath %>
<!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" src="<%=basePath %>/resource/js/json2.js" ></script>
<script type="text/javascript" src="<%=basePath %>/resource/js/jquery-1.7.1.min.js" ></script>
<script type="text/javascript">
function sendRequest(){
var uu = "jsondemo";
$.ajax({
type:"get",
dataType:"json",
url:"jsondemo",
data:{"a":1,"b":2},
success:function(data){
alert(JSON.stringify(data));
$.each(data,function(name,value) {
alert(name+":"+value);
});
}
});
}
</script>
</head>
<body>
<h2>Hello Daotie</h2>
<input type="button" value=" json demo " onclick="sendRequest()">
</body>
</html>
2 web.xml配置
<servlet>
<servlet-name>JsonDemo</servlet-name>
<servlet-class>com.daotie.servlet.JsonServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>JsonDemo</servlet-name>
<url-pattern>/jsondemo</url-pattern>
</servlet-mapping>
3 Servlet类
package com.daotie.servlet;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONObject;
public class JsonServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public JsonServlet() {
super();
// TODO Auto-generated constructor stub
}
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
System.out.println("doGet");
String a = request.getParameter("a");
System.out.println(a);
Map<Object,Object> map = new HashMap<Object, Object>();
JSONObject json = new JSONObject();
map.put("name", "admin");
map.put("password", "123");
json.putAll(map);
System.out.println(json.toString());
response.getWriter().print(json.toString());
}
protected void doPost(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
}
}
最后部署到jetty上或者tomcat上试试。
说明 在学习中发现 js部分的json.js脚本和jquery脚本有冲突， 网上人说建议使用json2.js 并且要先于jquery引入。
可以无法使用 parseJSON();和toJSONString()这两个函数。
希望对你有帮助。
分享到：
相关推荐
在本文中，我们将深入探讨如何使用jQuery、Uploadify、Struts2和JSP技术实现一个图片批量上传的Demo。这个组合提供了高效、用户友好的文件上传解决方案，特别适合需要处理大量图片的Web应用。 首先，jQuery是一个轻...
在"GameAPI"这个压缩包中，很可能包含了一个游戏相关的API接口示例，使用Struts2作为后端处理逻辑，通过JSON进行数据交换，前端可能使用JQUERY和AJAX进行异步通信。具体的实现可能包括以下几个部分： 1. **Action类...
在IT行业中，跨域访问是Web开发中一个重要的概念，特别是在使用JavaScript、JSP、JSON以及前端库如jQuery时。本教程将详细讲解如何利用这些技术实现跨域数据交互。 首先，我们需要理解“跨域”这个术语。在浏览器的...
在本项目"C3P0+DBUtils+Ajax+Json+Jquery实现【增删改查】Demo"中，我们将探讨如何结合这些技术来构建一个功能完善的Web应用，用于执行基本的数据操作，即增（Add）、删（Delete）、改（Modify）和查（Query）。...
在这个"ssh+jquery+ajax二级联动"项目中，开发者可能创建了一个简单的Web应用，实现了基于Ajax的二级联动选择功能。这通常在多级下拉菜单或地区选择等场景中常见，例如：省份选择后，城市列表会动态加载更新。 1. *...
在这个"struts2 Ajax json Jquery demo"中，我们将探讨这些技术如何协同工作，创建一个异步数据交换的示例。 首先，Struts2是一个基于MVC（模型-视图-控制器）架构的Java Web框架，它简化了开发过程，提供了一种...
5. **示例代码**：在提供的压缩包文件中，可能包含了一个简单的JSP页面，它包含了发送Ajax请求的JavaScript代码，以及一个Struts2 Action类，处理这个请求并返回JSON数据。你可以将这些文件导入到你的Web工程中，...
总的来说，"Jquery Flexigrid jsp Demo"是一个实际应用示例，展示了如何在JSP环境中利用Flexigrid实现动态数据展示和交互。通过学习这个Demo，开发者可以更好地理解如何将前端的JavaScript库与后端的Java服务进行...
jQuery是一个高效、简洁的JavaScript库，而Ajax则是实现页面无刷新更新的关键技术。本实例将深入讲解如何结合jQuery和Ajax进行网页动态交互，特别适合初学者入门学习。 首先，jQuery库简化了JavaScript的DOM操作，...
**JqGrid Demo json** 是一个基于Web的前端数据展示示例，它使用了JqGrid库和JSON数据格式来实现动态、交互式的表格。JqGrid是一个强大的jQuery插件，用于创建高度可定制和功能丰富的网格视图，广泛应用于数据管理和...
总的来说，"JQuery实现选座功能逻辑的Demo"提供了一个基础的前端选座实现，通过JQuery的事件处理和DOM操作，结合JSON数据和Ajax通信，可以构建出一个直观且可扩展的选座系统。对于开发者来说，理解并掌握这一实现有...
本教程将聚焦于一个特定的应用场景——“JSP中实现行内编辑效果”，这是一种提高用户交互性和效率的设计策略，常见于数据表格和列表展示应用中。用户可以直接在页面上编辑数据，无需跳转到单独的编辑页面。 在描述...
【Ajax jQuery Demo】是一个关于如何在Web开发中利用Ajax技术和jQuery库进行数据交互的示例项目。Ajax（Asynchronous JavaScript and XML）技术允许我们在不刷新整个网页的情况下，通过JavaScript与服务器进行异步...
`demo2_json.jsp`是一个JSP文件，通常用于展示登录界面和处理用户输入。在这个例子中，JSP可能通过AJAX向`LoginAction`发送POST请求，获取返回的JSON数据，并根据"success"字段更新界面。例如，使用jQuery进行异步...
jqGrid 是一个基于 jQuery 的数据网格插件，用于在网页上展示和操作大量结构化数据。这个"jqGrid demo （完整版）"提供了一个全面的示例，可以帮助开发者更好地理解和应用 jqGrid，无论是在 PHP 或 JSP 环境中。 1....
在这个场景下，我们有两个在线聊天的demo，一个是基于jsp+servlet的，另一个则是利用ajax实现的。这两种方法都为我们提供了实时交互的功能，但它们的技术实现有所不同。 首先，让我们来看看jsp（JavaServer Pages）...
3. 创建图表容器：在HTML中定义一个元素作为图表的容器。 4. 初始化图表：使用JavaScript来实例化Highcharts对象并设置相关配置。 5. 动态更新：如果需要，可以随时更新图表数据。 ### 2. 文件结构 在使用...
在"uploaddemo"这个压缩包中，可能包含了一个简单的JSP文件上传和AJAX获取JSON数据的示例项目。项目可能包括JSP页面、Servlet类、HTML/JavaScript代码以及数据库相关的配置文件。通过分析和运行这个示例，开发者可以...
Spring MVC 是一个基于Java的轻量级Web应用框架，它为构建RESTful应用程序提供了强大的支持。DataTable 是一款功能丰富的jQuery插件，用于处理表格数据，提供了动态加载、排序、筛选和分页等功能，极大地提升了用户...
通过四种Ajax工具JQuery、JSON、DWR、Prototype分别实现页面与后台（类文件）的数据交互，从而使得在不刷新页面的情况下取得数据，改变Select框中的值。 进入主页后可以点击不同链接访问你想查看的DEMO ...