相关名词解释:
什么是JSON:
JSON (JavaScript Object Notation)
是一种轻量级的数据交换格式。它便于人类读写,也易于机器分析和生成。它基于标准的ECMA-262第三版(1999年12月)的JavaScript编程语言的一个子集。
JSON是一种完全独立于语言的文本格式,但是它使用对于C家族语言(包括C、C++、C#、Java、JavaScript、Perl、Python等)的编程人员来说非常熟悉的约定。这些特性使得JSON成为理想的数据交换语言。
JSON基于两种结构:
- 名值对集合。在不同的语言中,这分别被当作对象、记录、结构体、字典、散列表、有键列表或关联数组。
a) 如果是单个对象如
:{“menuid”:”m1”,”menuName”:”m1”}
b) 如果是数据的话如
:{“menuList”:[{“menuid”:”m1”,”menuName”:”m1”},{“menuid”:”m2”,”menuName”:”m2”}]}
- 值的有序列表。在大多数语言中,这分别被当作数组、向量、列表或序列。
这些都是通用的数据结构。几乎所有的现代编程语言都以某种形式对它们提供支持。可与编程语言进行交换的数据格式也基于这些结构是很合理的。
什么是JSON-RPC?
JSON-RPC是一种轻量级的远程过程调用协议,它允许从Javascript进行客户-服务器 交互。通用机制包含两个建立数据连接的对等体。在连接的生存期内,对等体可以调用另一个对等体所提供的方法。要调用远程方法,就要发送请求。请求必须使用 应答进行响应,除非该请求是一个通知。
这有什么好处呢?使用
JSON-RPC,可以创建定制的Java对象,并可通过Javascript和Ajax实现对其方法的完全访问。此外,这些对象在会话的整个生存期中都将存留!
这需要两个库:需要驻留在服务器应用程序上的
json-lib-1.1-jdk15.jar和支持它的包文件ezmorph-1.0.2.jar.
什么是prototype?
prototype.js 是由
Sam Stephenson 写的一个 javascript 类库。这个构思奇妙,而且
兼容标准的类库,能帮助你轻松建立有高度互动的 Web 2.0 特性的富客户端页面。现在的版本是1.5.1.1
准备工作:
1. 下载json-lib-1.1-jdk15.jar,地址
:
http://json-lib.sourceforge.net/
2. 下载 ezmorph-1.0.2.jar 地址
:
http://ezmorph.sourceforge.net/
3. 下载
prototype.js 地址:http://www.prototypejs.org/
4. 建立struts开发环境,我用的是struts2.0,struts的使用不在此文中讲解
5. 可以读取数据库中的数据,或者是自己封装一个list
开发步骤:
1. 建立一个JsonAction.java
a) 该action的功能就是使用JSON组织成一定的格式供页面调用
代码:
public class JsonAction extends ActionSupport{
Log log = LogFactory.getLog(JsonAction.
class
);
public String execute() {
List <String> list = new ArrayList<String>(3);;//取得数据你可以封装自己的对象
list.add("It's no bad!");
list.add("WOW!");
list.add("No comment!");
try
{
JSONObject ci = new JSONObject();
JSONObject ci1 = new JSONObject();
JSONArray itemList = new JSONArray();
ci.put("menuid", list.get(0));
ci.put("menuName", list.get(1));
ci.put("url",list.get(2));
itemList.add(ci);
ci1.put("itemList1", itemList);
ServletActionContext.getResponse().setHeader("X-JSON", ci.toString());
ServletActionContext.getResponse().setCharacterEncoding("UTF-8");//设置编码格式
ServletActionContext.getResponse().setHeader("Cache-Control", "no-cache");//清楚缓存
ServletActionContext.getResponse().getWriter().print(ci1.toString());
}
catch
(Exception e) {
HashMap hm =
new
HashMap();
hm.put(
“executeError”
,
“Couldn’t find the Full Name because an error occured.”
);
log.error(
“Couldn’t find the Full Name because an error occured.”
);
JSONObject json = JSONObject.fromObject(hm);
response.setHeader(
“X-JSON”
, json.toString());
response.setCharacterEncoding(
“UTF-8″
);
}
return
null
;
}
2. 配置struts.xml
<action name="JsonAction" class="TestPage.JsonAction">
<result type="json" />
</action>
3. 建立一个测试页面:test.jsp
代码:
<%@
page
contentType
=
“text/html; charset=UTF-8″
%>
<
HTML
>
<
HEAD
>
<
TITLE
>
Json Test
</
TITLE
>
<
meta
http-equiv
=
“Content-Type”
content
=
“text/html; charset=UTF-8″
>
</
HEAD
>
<
script
type
=
“text/javascript”
src
=
“/js/prototype.js”
></
script
>
<script type="text/javascript">
var dd = {lookup:function (){
var url = 'JsonAction.action';
var pars = '';
var myAjax = new Ajax.Request(url,{method: 'get',encoding:'UTF-8', parameters: pars, onComplete: function(json) {
var JSONobj = eval('('+json.responseText+')');
var html="";
var menuid="";
for (var i=0; i< JSONobj.itemList1.length; i++)
{
var item = JSONobj.itemList1[i];
html += "<li>" + item.menuid+ item.menuName +item.url +"</li>";
}
$("item").innerHTML=html;
}
});
}
}
</script>
<
BODY
>
<
input
type
=
“button”
name
=
“button”
id
=
“button”
onclick
=
“dd.lookup();”
value
=
“
点击测试
“
>
<
div
id
=
“item”
></
div
>
</
BODY
>
</
HTML
>
注意事项
:
1.
建立的项目必须统一编码格式
:
我使用的是
UTF-8,
你也可以使用
GBK,GB2312