实例解析java_+_jQuery_+_json工作过程

实例解析java + jQuery + json工作过程(登录)
2009年02月24日  |  9:55 下午 分类：Java, ajax, finance, jQuery, json, 教程, 项目  |  标签：ajax、Java、jQuery、json、json-lib、教程  |  4,688 views
本文主要讲解在java环境下使用jQuery进行JSON数据传送的交互过程

参考根据作者的账务管理系统(个人版) 源码下载 讲解


一、相关技术、工具简介

1、简单介绍一下JSON，JSON是一种轻量级的数据交换格式。 易于人阅读和编写。同时也易于机器解析和生成。已键值对形式表示数据，和java中的Map的数据存储形式相似，具体细节请参考http://www.json.org/json-zh.html。

2、对应后台JSON的数据处理工具json-lib，包含各种格式数据的工具类，比如：JavaBean、数组、集合(Collection)等，参考API文档。

3、jQuery框架中的数据表现形式，如果你熟悉jQuery的话就会发现jQuery的使用的数据传输都是JSON格式，比如我们经常使用的$.ajax方法：

$.ajax({
url : url,
data : {
id : chkValue
},
cache : false,
dataType : "json",
success : function(result){
alert(result);
}
);
其中 {…} 表示的就是JSON格式的数据

二、前台工作方式
为了能够容易理解以系统登录讲解，最后会以一个实例的方式讲解

1、登录页面
代码请参见 http://code.google.com/p/finance-p/source/browse/trunk/login.jsp

用户名：
<input id="loginName" name="loginName" size="20" type="text" />
 
密码：
<input id="password" name="password" size="20" type="password" />
2、登录javascript文件 login.js

/**
 * 设置表单验证规则
 */
function regFormValidator() {
$.formValidator.initConfig({formid:"loginForm"});
$("#loginName").formValidator({
onshow : "请输入用户名",
onfocus : "用户名至少2个字,最多4个字"
}).inputValidator({
min : 1,
onerror : "你输入的用户名非法,请确认"
});
 
$("#password").formValidator({
onshow : "请输入密码"
}).inputValidator({
min : 6,
onerror : "密码在6位以上，请确认"
});
}