- 浏览: 327426 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
chenfang_0913:
您好,我按照您的方法在Windows端进行了实现,可是我一直捕 ...
java实现网卡数据包抓取学习 -
wps886:
google了半天全是错的,只有楼主的xml配置有用,太感谢了 ...
奇怪的400 BAD REQUEST -
laputa73:
node.addEventListener('mouseup' ...
网络拓扑图DEMO -
njyyao:
单击、双击、右击的事件处理事件?
网络拓扑图DEMO -
lilinshtandby:
不错不错,赞一个
dhtmlxTree总结
由有不当之处,还望大家能指出。
直接进入主题,使用jquery发送请求到servlet,返回json字符串,然后在前台解析json并显示
后台servlet的请求处理(需要引入json.jar):
import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.json.JSONArray; import org.json.JSONObject; public class JsonViewServlet extends HttpServlet { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { doPost(req,resp); } protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { resp.setContentType("text/html;charset=UTF-8"); resp.setHeader("Cache-Control","no-cache"); JSONObject json = new JSONObject(); try{ JSONArray members = new JSONArray(); for(int i=0;i<10;i++){ JSONObject member = new JSONObject() .put("name", "张小"+i) .put("age", "28") .put("email", "test@test.com"); members.put(i, member); } json.put("jobs", members); }catch(Exception e){ e.printStackTrace(); } System.out.println(json.toString()); resp.getWriter().write(json.toString()); } }
通过上面代码,将向页面发送下面字符串:
{"jobs":[ {"age":"28","email":"test@test.com","name":"张小0"}, {"age":"28","email":"test@test.com","name":"张小1"}, {"age":"28","email":"test@test.com","name":"张小2"}, {"age":"28","email":"test@test.com","name":"张小3"}, {"age":"28","email":"test@test.com","name":"张小4"}, {"age":"28","email":"test@test.com","name":"张小5"}, {"age":"28","email":"test@test.com","name":"张小6"}, {"age":"28","email":"test@test.com","name":"张小7"}, {"age":"28","email":"test@test.com","name":"张小8"}, {"age":"28","email":"test@test.com","name":"张小9"} ]}
前台页面(需要引入jquery.js和json.js):
<%@ page language="java" contentType="text/html;charset=utf-8" pageEncoding="utf-8"%> <html> <head> <title>使用jquery ajax显示JSON数据</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script language="javascript" src="../jslib/jquery.js"></script> <script language="javascript" src="../jslib/json.js"></script> </head> <body> <h1>JSON数据显示.</h1> <input type="button" value="JsonView" onClick="jsonview();"> <div id="dateMessage"> <table id="planTable"> <tr><td>名称</td><td>年龄</td><td>邮箱</td></tr> </table> </div> </body> </html> <script language="javascript"> function jsonview(){ $.getJSON("http://localhost:8080/ajaxServlet/servlet/jsonViewServlet",null,function call(data){ wirteHtml(data); });} function wirteHtml(data){ //alert(data.toJSONString()); //alert(data.jobs);//返回的data就是一个JSON的对象 var continents = data.jobs; for(var i=0;i<continents.length;i++){ //alert(continents[i].name); var newLine = $("#planTable").length; var row = planTable.insertRow(newLine); var col = row.insertCell(0); col.innerHTML = continents[i].name; col = row.insertCell(1); col.innerHTML = continents[i].age; col = row.insertCell(2); col.innerHTML = continents[i].email; } } </script>
WEB.XML配置
<!-- jsonView servlet --> <servlet> <servlet-name>jsonViewServlet</servlet-name> <servlet-class>com.arthurs.json.JsonViewServlet</servlet-class> </servlet> <!-- jsonView mapping --> <servlet-mapping> <servlet-name>jsonViewServlet</servlet-name> <url-pattern>/servlet/jsonViewServlet</url-pattern> </servlet-mapping>
文中用到的jquery.js和json.js在附件中
- jslib.rar (21.7 KB)
- 下载次数: 642
评论
8 楼
scxiongruoyu
2012-06-19
很多问题啊~
7 楼
cn_arthurs
2012-05-21
chenxun101 写道
psl19892010 写道
data是哪儿来的?
同问
data的内容是servlet返回的json数据,通过回调函数赋值给了页面中的data变量
6 楼
chenxun101
2012-05-21
psl19892010 写道
data是哪儿来的?
同问
5 楼
psl19892010
2012-01-12
data是哪儿来的?
4 楼
cn_arthurs
2010-10-20
class
请确认你的json.jar,以及其他所需要的jar包都正确
另外tomcat运行的jre版本和jdk的编译版本是否一致
比如,你jdk1.6编译出来的class文件,如果在jdk1.5的运行环境中执行,会提示版本问题
qiaoqinqie 写道
很好 学习了 不过我的会报异常?
严重: Servlet.service() for servlet action threw exception
java.lang.UnsupportedClassVersionError: Bad version number in .class file (unable to load class org.json.JSONArray)
at org.apache.catalina.loader.WebappClassLoader.findClassInternal(WebappClassLoader.java:2737)
at org.apache.catalina.loader.WebappClassLoader.findClass(WebappClassLoader.java:1124)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1612)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1491)
好像版本不对?
严重: Servlet.service() for servlet action threw exception
java.lang.UnsupportedClassVersionError: Bad version number in .class file (unable to load class org.json.JSONArray)
at org.apache.catalina.loader.WebappClassLoader.findClassInternal(WebappClassLoader.java:2737)
at org.apache.catalina.loader.WebappClassLoader.findClass(WebappClassLoader.java:1124)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1612)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1491)
好像版本不对?
请确认你的json.jar,以及其他所需要的jar包都正确
另外tomcat运行的jre版本和jdk的编译版本是否一致
比如,你jdk1.6编译出来的class文件,如果在jdk1.5的运行环境中执行,会提示版本问题
3 楼
qiaoqinqie
2010-10-18
很好 学习了 不过我的会报异常?
严重: Servlet.service() for servlet action threw exception
java.lang.UnsupportedClassVersionError: Bad version number in .class file (unable to load class org.json.JSONArray)
at org.apache.catalina.loader.WebappClassLoader.findClassInternal(WebappClassLoader.java:2737)
at org.apache.catalina.loader.WebappClassLoader.findClass(WebappClassLoader.java:1124)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1612)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1491)
好像版本不对?
严重: Servlet.service() for servlet action threw exception
java.lang.UnsupportedClassVersionError: Bad version number in .class file (unable to load class org.json.JSONArray)
at org.apache.catalina.loader.WebappClassLoader.findClassInternal(WebappClassLoader.java:2737)
at org.apache.catalina.loader.WebappClassLoader.findClass(WebappClassLoader.java:1124)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1612)
at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1491)
好像版本不对?
2 楼
chris_zcl
2010-02-04
chris_zcl 写道
太好了
再顶你一下~
1 楼
chris_zcl
2010-02-04
太好了
发表评论
-
禁止页面放大缩小
2013-05-12 18:42 1903<html> <head> &l ... -
在web.xml中添加多个filter
2011-05-10 15:32 6665web.xml中的多个filter的运行顺序walker(wa ... -
tomcat无法启动
2011-05-08 09:11 1119Myeclipse8.5 + Tomcat7.0.5 发布应 ... -
XML to JSON
2011-04-06 16:17 1300现在JSON在前台的应用越来越广泛,不过也有很多系统是基于XM ... -
ajax tree框架(zTree)
2011-04-05 12:23 2892在以往的项目中,有时会用到树菜单的操作.我用过dhtmltre ... -
通过HttpClient发送Web Service请求
2011-01-19 10:29 1845import java.io.ByteArrayInputSt ... -
使用JES搭建小巧的Mail服务器
2010-10-26 21:56 1601最新需要使用MAIL服务器进行测试,正所谓山不在高,有仙则灵. ... -
struts2+spring2+hibernate3所需要的最少jar包
2010-04-19 16:06 1600Spring2所需要的jar包最简单,只需要一个综合的spri ... -
Struts2中获取requset,session,application
2010-01-04 13:24 1610struts2中Action是集成于com.opensymph ... -
struts2.0中struts.xml配置文件详解(转)
2010-01-04 11:10 1111<!DOCTYPE struts PUBLIC &quo ... -
struts2-Unable to load configuration. - bean - jar
2010-01-01 12:01 2855在整合Struts2 + Spring2 + Hibernat ... -
[转载]企业级SOA之路——在Web Service中使用HTTP和JMS
2009-12-28 10:28 1238本文来自CSDN博客,转载请标明出处:http://blog. ... -
XAMPP虚拟主机配置,实现单主机多个站点
2009-10-24 23:31 2785打开注释 NameVirtualHost *:80 ... -
thinkphp中使用ajax接收json数据
2009-04-01 17:25 9496参考thinkphp+jquery实现ajax,扩展了下,写了 ... -
基于服务器推的web im(未实现)
2009-03-24 16:10 1387想着手研究一下服务器推技术,看看能不能写出一个web im程序 ... -
使用dhtmltree动态生成树菜单总结
2009-03-19 13:49 5737我之前发布的dhtmltree总 ... -
能够自由拖动布局区域的网页
2009-03-11 09:54 2498<html> <head> <t ... -
在OpenFire的基础上安装JWChat 1.0
2009-02-12 17:57 0http://blog.csdn.net/simonhe197 ... -
JSON介绍
2008-12-11 12:18 2029JSON已经被广泛誉为浏览器中XML的替代品,它的目标仅仅是成 ... -
关于SSO跨应用访问操作解决思路
2008-11-25 22:03 1540最近接手了一些使用CAS,单点登陆的几个项目,项目进行挺顺利, ...
相关推荐
结合以上技术,一个简单的SSH+JQuery+JSON例子可能包含以下步骤: 1. 用户通过前端页面发送Ajax请求,请求由JQuery发起,数据格式为JSON。 2. Struts框架接收到请求,通过Action转发到Spring控制层。 3. Spring控制...
在这个"struts2+jquery+json"的小例子中,我们可能会看到以下几个关键知识点: 1. **Struts2框架**: - **Action和Result**:Struts2的核心组件,Action负责业务逻辑处理,Result负责控制页面跳转。 - **...
在Web开发中,jQuery、Ajax和JSON是三个非常重要的技术,它们共同构成了高效、动态的用户界面的基础。本文将深入探讨这些技术,并结合一个名为"TestJQuery"的示例来展示它们如何协同工作。 首先,jQuery是一个...
在提供的压缩包中,"新建 文本文档.txt"可能是示例代码或者关于这个例子的说明,而"JQuery&JSON"可能是一个包含jQuery库和JSON数据文件的目录。确保正确引用这些资源,以使示例正常工作。 总结来说,这个综合例子...
Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON
总结起来,"struts2+jquery+json+ajax"的例子展示了如何利用这些技术协同工作,实现一个无刷新的登录界面,提供流畅的用户体验。通过Struts2处理业务逻辑和数据验证,jQuery和Ajax负责前后端的通信,JSON作为数据...
在这个“用Velocity改装的jquery+json+springMVC+ibatis简单例子”中,我们探讨的是一个集成多种技术的Web应用程序开发示例。这个项目利用了Velocity作为模板引擎,jQuery作为前端JavaScript库,JSON作为数据交换...
本人折腾了两天才探索出来的, 程序简单,客服端通过jquery的getJSON函数请求PHP服务端,服务端返回一个二维数组,客户端把结果经简单处理打印出来。此例非常经典,初学者看了可以少走很多弯路(因为那些弯路我帮你...
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它采用...总的来说,这个例子展示了如何结合JSON、JSP和jQuery实现一个现代Web应用的无刷新登录功能,利用AJAX实现前后端的异步通信,提高了用户体验。
总结来说,这个例子展示了如何利用Struts2处理后端业务逻辑,使用JSON作为数据交换格式,以及通过jQuery在前端实现动态更新和与服务器的异步通信。了解和掌握这三个工具的整合使用,对于提升Web开发效率和用户体验...
总结来说,这个“jquery+flexigrid+json的java例子”演示了如何利用jQuery进行前端交互,Flexigrid显示数据,JSON作为数据交换格式,以及Java处理后端逻辑。这是一个典型的前后端分离的Web应用架构,对于学习现代Web...
在IT行业中,jQuery、JSON和WebService是三种非常关键的技术,它们在Web开发中扮演着重要角色。本篇文章将深入探讨这三者之间的交互,并详细解释它们各自的功能与用途。 首先,jQuery是一个轻量级的JavaScript库,...
实现一个简单ajax+jquery+highcharts+json例子,主要让初学者了解ajax+jquery是怎么接受后台传过来的json数据,并显示到前台highcharts中的,以及js文件应该如何放置等问题。
结合struts2.3.4+jQuery+mysql+json开发的一个小例子。
在这个例子中,`data.json`是包含JSON数据的文件,`data`参数是解析后的JSON对象。 ### 3. 数据绑定到页面 获取到JSON数据后,jQuery可以轻松地将数据绑定到页面元素。例如,将JSON对象的属性显示在HTML元素中: ...
一个典型的JSON对象可能包含各个饼块的名称和对应的值,如下面的例子所示: ```json { "data": [ {"name": "类别1", "value": 335}, {"name": "类别2", "value": 310}, {"name": "类别3", "value": 260}, {...
在这个例子中,它调用了"AjaxHandler.ashx"这个服务端处理程序,然后在回调函数中解析返回的JSON数据。$.each方法用于遍历JSON数组,并将数据插入到HTML元素中,使得数据在页面上动态显示出来。 总结来说,这个技术...
在网页开发中,联动下拉列表是一种常见...这个例子对于理解和实现多级联动下拉列表非常有帮助,也展示了jQuery和JSON在前端数据管理中的应用。通过这种方式,开发者可以创建更加动态和交互性的网页应用,提高用户体验。
在这个例子中,我们将使用jQuery库来实现客户端的AJAX请求,通过无刷新的方式更新表格内容。 2. 业务逻辑层:这部分包含了应用的核心逻辑,处理用户请求并执行相应的业务操作。在.NET中,我们通常会创建服务接口或...