利用json和prototype來做用戶是否正確的判斷,傳統的方式是提交後做判斷,這裏使用的是ajax異步傳輸的方式。
所需文件
1.UserLogin_JSON.jsp (主要頁面,在IE中基本中出現這個頁面,其它的處理都在後臺不可見)
2.check_login_user.jsp (這個做爲判斷用戶名是否正確的文件,可以寫成jsp,servlet,在struts2中就可以爲一個action)
3.AjaxMessageJson.java (將java對象轉成json數據格式,需要用到org.json,json-lib.jar)
4.js/prototype.js (這是js/prototype的庫,網上隨處可下)
5.json.js (用來解析得到的responseText,否則客戶端得到的是html格式的文件)
1.UserLogin_JSON.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<html>
<head>
<title>用戶登錄測試json返回數據格式</title>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/comm.js"></script>
<script language="JavaScript" type="text/javascript">
<!--
var flagSubmit = false ;
function checkUserName() {
//var contextPath = "<%=request.getContextPath()%>";
var url = "check_login_user.jsp";
var pars = "username=" + $('username').value;
var myAjax = new Ajax.Request(url, {method: 'get', parameters: pars,onLoading : loading,onFailure:reportError,onComplete: done});
}
function loading()
{
// alert('正在調用');
}
function done(res) {
resText = res.responseText;
alert(resText);
var jsonMsgObj = new JsonMsgObj(resText);
var message = jsonMsgObj.getMessage();
alert(message);
}
function reportError(request)
{
alert('Sorry. There was an error.');
}
</script>
</head>
<body>
<form action="sub.jsp" method="post" name="form1">
用戶名:<input type="text" name="username""/><br>
<input type="button" name="button" value="" onclick="checkUserName()">
</form>
</body>
</html>
2.check_login_user.jsp //註釋:注意不要出現任何html的標籤,這裏只做一個簡單的判斷,可以方便的擴充爲數據庫判斷
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<%@ page import=" com.shangyu.json.AjaxMessageJson"%>
<%
String username=request.getParameter("username");
//System.out.println("執行後臺:"+username);
AjaxMessageJson ajaxMessagesJson=new AjaxMessageJson();
if(username.equals("fly"))
ajaxMessagesJson.setMessage("E_USERNAME_001", "用戶名正確!");
else
ajaxMessagesJson.setMessage("E_USERNAME_001", "用戶名不太正確!");
out.println(ajaxMessagesJson.getJsonString());
%>
3.AjaxMessageJson.java
package com.shangyu.json;
import org.json.*;
public class AjaxMessageJson {
private JSONObject json = new JSONObject();
public void setMessage(String codeid, String message) {
try {
this.json.put("codeid", codeid);
this.json.put("message", message);
this.json.put("text", "");
} catch (JSONException e) {
}
}
public void setMessage(String codeid, String message, String text) {
try {
this.json.put("codeid", codeid);
this.json.put("message", message);
this.json.put("text", text);
} catch (JSONException e) {
}
}
public String getJsonString() {
return this.json.toString();
}
}
當然如果僅僅只需要做一個用戶名是否存在或正確的判斷,完全可以不需要用到json來做數據格式的傳輸,直接利用html文本方式來就可以了。
但是如果要傳輸更爲複雜一些的數據,則可以利用XML和json,但由於xml在客戶端解析的複雜性,現在要實現ajax功能,普遍傾向於使用json