if(window.ActiveObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
<script type="text/javascript">
var xmlHttp;
//创建XMLHttpRequest对象
function createXMLHttpRequest() {
if(window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
} else if(window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
function validate() {
//todo 编写Ajax校验,发送请求和处理,并且显示信息
//创建createXMLRequest对象
createXMLHttpRequest();
//使用DOM,得到id值是username的域
var username = document.getElementById("username");
var url = "ValidateUsernameCtl?username=" + escape(username.value);
//向服务器端的ValidateUsernameCtl发送异步请求
xmlHttp.open("GET", url, true);
xmlHttp.onreadystatechange = callback;
xmlHttp.send(null);
}
function callback() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
//以responseXML属性,接收服务器端返回的xml文件,使用DOM进行解析
var msg = xmlHttp.responseXML.getElementsByTagName("message")[0].firstChild.data;
var passed = xmlHttp.responseXML.getElementsByTagName("passed")[0].firstChild.data;
setMessage(msg, passed);
}
}
}
function setMessage(message, passed) {
var validateMessage = document.getElementById("usernamemsg");
var fontColor = "red";
if(passed == "true") {
fontColor = "green";
}
//对<div name="usernmaesg">的地方设置其间的代码innerHTML为指定代码
validateMessage.innerHTML = "<font color=" + fontColor + ">" + message + "</font>";
}
</script>
<!--struts + ajax json //tips struts 整合 ajax json-->
<dependency>
<groupId>org.apache.struts</groupId>
<artifactId>struts2-json-plugin</artifactId>
<version>2.3.16.1</version>
</dependency>
<!--JSON-->
<dependency>
<groupId>org.json</groupId>
<artifactId>json</artifactId>
<version>20160810</version>
</dependency>
<package name="ajax" namespace="/ajax" extends="json-default" >
<action name="ajaxAction" class="ajaxAction">
<!-- 返回类型为json-->
<result name="register" type="json">
<!--tips 参数root的含义-->
<param name="root">message</param>
</result>
</action>
</package>
public class JsonJqueryStruts2Action extends ActionSupport {
private String message; //使用json返回单个值
private UserInfo userInfo; //使用json返回对象
... ...
}
{"userInfo":[
{"userId":"Patrick", "userName":"123456"}
]}
{"data":[
{"userInfo":[ {"userId":"Patrick", "userName":"123456"} ] },
{"message":"testMesssageData"}
]}
package com.zker.action;
import com.opensymphony.xwork2.ActionSupport;
import com.zker.common.util.Message;
import com.zker.common.util.SpringContextUtils;
import com.zker.dao.user.UserDao;
import org.json.JSONObject;
import java.io.IOException;
public class AjaxAction extends ActionSupport {
/**用来接受封装的参数 LoginName 用户名*/
String loginName;
/**封装信息,为了测试JSON刻意做成简单的类*/
Message message = new Message();
/**用来返回用于js接收*/
String result;
//tips 要有getter&setter,否则$post的param参数传递不过来
public String getLoginName() {
return loginName;
}
public void setLoginName(String loginName) {
this.loginName = loginName;
}
public Message getMessage() {
return message;
}
public void setMessage(Message message) {
this.message = message;
}
public String getResult() {
return result;
}
public void setResult(String result) {
this.result = result;
}
/**
* 利用Ajax实现注册的用户名重复性校验
* @return
*/
public String ajaxRegister() throws IOException {
//tips 如何手动取出容器中的bean?答案如下
UserDao userDao = (UserDao)SpringContextUtils.context.getBean("userDao");
if (userDao.findAdminByLoginName(loginName) != null
|| userDao.findUserByLoginName(loginName) != null) {
message.setMsg("用户名已存在");
message.setStatus(false);
} else {
message.setMsg("用户名可以注册");
message.setStatus(true);
}
/*
//JSON-String转换 obj -> jsonStr
//当struts-login.xml中root为result时,此处才需要解开
this.result = JSONObject.wrap(message).toString();
*/
return "register";
}
}
<!--Ajax + JSON-->
$(document).ready( function() {
//使用 Ajax 的方式 判断登录
$("#loginName").blur( function() {
var url = "/ajax/ajaxAction!ajaxRegister";
var params = {loginName : $("#loginName").val()};
/*method1 <param name="root">result</param>
$.post(
url, //服务器要接受的url
params, //传递的参数
function validateLoginName(result){ //服务器返回后执行的函数 参数msg保存的是服务器发送到客户端的数据
//alert("服务器端返回的data --> " + result);
var msgObj = eval("(" + result + ")"); //jsonStr -> jsObj(jsonObj)
var passed = msgObj.status;
setMessage(msgObj.msg, passed);
},
‘json‘ //数据传递的类型 json
);
*/
/*method2 <param name="root">message</param> */
$.post(
url, //服务器要接受的url
params, //传递的参数
function validateLoginName(message){ //服务器返回后执行的函数 参数是服务器发送到客户端的数据
var msg = message.msg;
var passed = message.status;
setMessage(msg, passed);
},
‘json‘ //数据传递的类型 json
);
function setMessage(message, passed) {
var validateMessage = document.getElementById("loginNameMsg");
var fontColor = "red";
if(passed) {
fontColor = "green";
}
//对<div name="loginNameMsg">的地方设置其间的代码innerHTML为指定代码
validateMessage.innerHTML = "<font color=" + fontColor + ">"
+ " "
+ message + "</font>";
}
});
});
<div id="loginNameMsg"></div>
<div class="login_sr">账号:<s:textfield cssClass="login_inputYhm" name="sysUser.loginName" id="loginName" />
Struts+Spring+Hibernate项目整合AJAX+JSON
原文:http://www.cnblogs.com/deng-cc/p/6343973.html