Posted on 2007-09-13 11:36
G_G 閱讀(2920)
評論(2) 編輯 收藏 所屬分類:
json
使用后好處?
??? java 和 javascript 使用同統一對象,語法?. 數據從 sever 到 v層?和?v層 到 sever ?方便.
??????????? 簡單說就是?JBean 不做修改拿到V層 當 JSBean (javascript 類)?中用
1.url 亂碼問題參照 Ajax uri 亂碼問題總結(IE,FF)
2.使用jar是 jxpath ; json? ......(與相關)
???????????????jxpath 參照 jxpath 學習筆記?
???????????????json 參照 使用json-lib
例題說明 數據 name,avg 在通過 ajax json 后 avg +1 再展現到頁面
本頁需要 json.js 下載到 http://www.json.org/json.js?
<%
@?page?pageEncoding
=
"
GBK
"
%>
<%
@?page?contentType
=
"
text/html;?charset=GBK
"
?
%>
??
<
html
>
??
<
head
>
????
<
title
>
json.html
</
title
>
????
????
<
meta?
http-equiv
="keywords"
?content
="keyword1,keyword2,keyword3"
>
????
<
SCRIPT?
src
="../js/json.js"
?
></
SCRIPT
>
?
????
<
script?
language
="javascript"
?type
="text/javascript"
>
????
var
?request?
=
?
false
;
????
?? // javascript ?Ajax? 沒什么好說的 這可以用 prototype prototype.js 的理解??,dojo?dojo? 等 ajax
? //本例?為方便直接寫了 ^_^?
????
function
?getOpen(){??????
???????
try
?{
?????????request?
=
?
new
?XMLHttpRequest();
???????}?
catch
?(trymicrosoft)?{
?????????
try
?{
???????????request?
=
?
new
?ActiveXObject(
"
Msxml2.XMLHTTP
"
);
?????????}?
catch
?(othermicrosoft)?{
???????????
try
?{
?????????????request?
=
?
new
?ActiveXObject(
"
Microsoft.XMLHTTP
"
);
???????????}?
catch
?(failed)?{
?????????????request?
=
?
false
;
???????????}??
?????????}
???????}
????}???
???????
???????
??????
function
?getCustomerInfo()?{
??????getOpen();
???????
if
?(
!
request)
?????????alert(
"
Error?initializing?XMLHttpRequest!
"
);
?????????
?????? //這通過 url 把數據傳給 server?
?????? //數據來源 javascript 類 就下方 DBdata???? string:?name:我名字^_^??,? int:?avg:年齡^_^
?????????
var
?url?
=
?
"
/json/json?jsonStr=
"
+
?(
new
?DBdata()).toJSONString()?;
?????????request.open(
"
GET
"
,?url,?
true
);
?????????request.send(
null
);
?????????request.onreadystatechange?
=
?updatePage;
???????}
???????
?????? //?ajax 處理?數據后返回的?結果?
????? // 年齡 +1?并輸入到 輸入框中
???????
function
?updatePage(){
???????
if
?(request.readyState?
==
?
4
)?
???????????
if
?(request.status?
==
?
200
){?
??????????? //得到 json str
?????????????
var
?jss?
=
?request.responseText;
??????????? //加載到 javascript 類中 string -> jsBean
?????????????
var
?jsobj?
=
?eval('('?
+
?jss?
+
?')');
???????????? //使用和 java對象一樣 ^_^
?????????????document.getElementById('xx').value?
=
?jsobj.name?
+
':'
+
?jsobj.avg?;
????????????}
???????}
????
//數據來源
?????
function
?DBdata(){
?????????
this
.name?
=
?'劉凱毅';
?????????
this
.avg
=
23
;?
?????????
this
.init
=
function
(){
?????????????alert('呵呵');
?????????}
?????}
</
script
>
??
</
head
>
??
<
body?
onload
=""
>
??????
<
INPUT?
id
='xx'?
type
="text"
?
>
??????
<
INPUT?
id
='x'?
type
="button"
?onclick
="getCustomerInfo()"
?value
="go"
>
??
</
body
>
</
html
>
為了方便明了我java方就使用了 server
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?org.apache.commons.jxpath.JXPathContext;
import?net.sf.json.JSONObject;
public?class?Json?extends?HttpServlet?{
????public?void?doGet(HttpServletRequest?req,HttpServletResponse?rpo)throws?ServletException,IOException{
????????rpo.setCharacterEncoding("GBK");
????????req.setCharacterEncoding("GBK");
????????rpo.setContentType("text/html;?charset=GBK");
????????
????????PrintWriter?out?=?rpo.getWriter()?;
???????
??? ??? //得到 url 傳入數據
????????String?str?=?req.getParameter("jsonStr")?;
??? ??? //java 方 string -> javaBean
????????JSONObject?jso?=?JSONObject.fromString(str);
??? ??? //javaBean 使用jxpathcontxt解讀更方便 ^_^
??????? //其實jso中是以 map 形式存區的 有興趣的可以自己動手寫下哦
????????JXPathContext?jx?=?JXPathContext.newContext(jso);
????????try?{
??? ?? ?? ?? //jxpath好處來了 avg + 1
????????????jx.setValue("./avg",?jx.getValue("./avg?+?1?")?);
????????}?catch?(Exception?e)?{e.printStackTrace();}
??? ???
??? ?? //以 jsonString 傳出
????????out.print(jso.toString());
????}
}
web.xml（好象有點多嘴了 哈哈 方便下入門人了）
????<servlet>
????????<servlet-name>json</servlet-name>
????????<servlet-class>servlet.Json</servlet-class>
????</servlet>
????<servlet-mapping>
????????<servlet-name>json</servlet-name>
????????<url-pattern>/json</url-pattern>
????</servlet-mapping>