在页面请求ajax对象，设置相应的参数进行提交，此例是后台进行登录代码的验证：
view plaincopy to clipboardprint?
<tr>
<td width="15%" nowrap="nowrap" class="title_item">园区代码</td>
<td><html-el:text property="login_code" styleId="login_code" maxlength="20" style="width:200px;" />
<span style="color:#ff0000;" mce_style="color:#ff0000;" id="star">*</span>
<span id="loading" style="display:none;" mce_style="display:none;">
<img src="${ctx}/images/loading.gif" mce_src="${ctx}/images/loading.gif" style="vertical-align:middle; margin: 2px;" mce_style="vertical-align:middle; margin: 2px;" />正在处理...
</span>
</td>
</tr>
<tr>
<td width="15%" nowrap="nowrap" class="title_item">园区代码</td>
<td><html-el:text property="login_code" styleId="login_code" maxlength="20" style="width:200px;" />
<span style="color:#ff0000;" mce_style="color:#ff0000;" id="star">*</span>
<span id="loading" style="display:none;" mce_style="display:none;">
<img src="${ctx}/images/loading.gif" mce_src="${ctx}/images/loading.gif" style="vertical-align:middle; margin: 2px;" mce_style="vertical-align:middle; margin: 2px;" />正在处理...
</span>
</td>
</tr>
对应js
view plaincopy to clipboardprint?
var xmlHttp = new XMLHttpRequest();
var doc = document;
$("#login_code").blur(function(){
if(this.value.length != 0){
var url = "Garden.do?method=getGardenCode&login_code="+this.value;
xmlHttp.onreadystatechange = function(){
var isExistCode = xmlHttp.responseText;
if(xmlHttp.readyState == 4){
doc.getElementById("loading").style.display = "none";
if(isExistCode == 1){
doc.getElementById("star").innerHTML = '<span id="tip" style="color:#FF0000;" mce_style="color:#FF0000;"><img src="${ctx}/images/reg_error.gif" mce_src="${ctx}/images/reg_error.gif" /> 对不起，该园区代码已存在！<//span>';
}else{
doc.getElementById("star").innerHTML = '<span id="tip" style="color:#5A8E4A;" mce_style="color:#5A8E4A;"><img src="${ctx}/images/reg_success.gif" mce_src="${ctx}/images/reg_success.gif" /> 恭喜，该园区代码可用<//span>';
}
}else{
doc.getElementById("loading").style.display = "";
}
};
xmlHttp.open("POST",url,true);
xmlHttp.send(null);
var xmlHttp = new XMLHttpRequest();
var doc = document;
$("#login_code").blur(function(){
if(this.value.length != 0){
var url = "Garden.do?method=getGardenCode&login_code="+this.value;
xmlHttp.onreadystatechange = function(){
var isExistCode = xmlHttp.responseText;
if(xmlHttp.readyState == 4){
doc.getElementById("loading").style.display = "none";
if(isExistCode == 1){
doc.getElementById("star").innerHTML = '<span id="tip" style="color:#FF0000;" mce_style="color:#FF0000;"><img src="${ctx}/images/reg_error.gif" mce_src="${ctx}/images/reg_error.gif" /> 对不起，该园区代码已存在！<//span>';
}else{
doc.getElementById("star").innerHTML = '<span id="tip" style="color:#5A8E4A;" mce_style="color:#5A8E4A;"><img src="${ctx}/images/reg_success.gif" mce_src="${ctx}/images/reg_success.gif" /> 恭喜，该园区代码可用<//span>';
}
}else{
doc.getElementById("loading").style.display = "";
}
};
xmlHttp.open("POST",url,true);
xmlHttp.send(null);
是jquery和script混用的~！~只要觉得方便，怎么整都行
数据请求处理的action请求返回的typeContent类型大概有四种：
1 服务端需要返回一段普通文本给客户端 --text/plain
2 服务端需要返回一段HTML代码给客户端 --text/html
3 服务端需要返回一段XML代码给客户端 --text/xml
4 服务端需要返回一段javascript代码给客户端-- text/javascript
5 服务端需要返回一段json串给客户端 --text/x-json
view plaincopy to clipboardprint?
public ActionForward getGardenCode(ActionMapping mapping, ActionForm form, HttpServletRequest request,
HttpServletResponse response) throws Exception {
DynaBean dynaBean = (DynaBean) form;
String login_code = (String) dynaBean.get("login_code");
UserInfo userInfoByCode = new UserInfo();
userInfoByCode.setRole_type(new Short("7"));
String isExistCode = "null";
if (StringUtils.isNotBlank(login_code)) {
userInfoByCode.setLogin_code(login_code);
if (null == super.getFacade().getUserInfoService().getUserInfo(userInfoByCode)) {
isExistCode = String.valueOf("0");
} else {
isExistCode = String.valueOf("1");
}
}
super.render(response, isExistCode, "text/plain;charset=UTF-8");
return null;
}
public ActionForward getGardenCode(ActionMapping mapping, ActionForm form, HttpServletRequest request,
HttpServletResponse response) throws Exception {
DynaBean dynaBean = (DynaBean) form;
String login_code = (String) dynaBean.get("login_code");
UserInfo userInfoByCode = new UserInfo();
userInfoByCode.setRole_type(new Short("7"));
String isExistCode = "null";
if (StringUtils.isNotBlank(login_code)) {
userInfoByCode.setLogin_code(login_code);
if (null == super.getFacade().getUserInfoService().getUserInfo(userInfoByCode)) {
isExistCode = String.valueOf("0");
} else {
isExistCode = String.valueOf("1");
}
}
super.render(response, isExistCode, "text/plain;charset=UTF-8");
return null;
}
view plaincopy to clipboardprint?
protected void render(HttpServletResponse response, String text, String contentType) {
try {
response.setContentType(contentType);
response.getWriter().write(text);
} catch (IOException e) {
logger.error(e.getMessage(), e);
}
}
protected void render(HttpServletResponse response, String text, String contentType) {
try {
response.setContentType(contentType);
response.getWriter().write(text);
} catch (IOException e) {
logger.error(e.getMessage(), e);
}
}
本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/wxl1985/archive/2009/03/02/3950058.aspx