首先搞明白观念:你action返回的值 ajax是得不到的。ajax能得到的是你action里往前台输出的内容,也就是action往输出流里输出的内容,而不是返回值。如果lz想要得到action返回给ajax的内容,那么在action里要得到输出流,然后把要给ajax的东西给输出流。这样ajax端才能得到你输出的内容。
之前普通js写ajax较多,因为工作中肯定会较多用jQuery的,所以专门总结下jQuery下的ajax的使用方法.
第一步,假定前台用post方式提交请求,有一个发送请求的页面bike.jsp
<form action="addBikes.action" method="post" onsubmit="return validate()"> <div id="mainInfo" style="margin-left: 30%;float: left;"> <TABLE align="left"> <tr> <td colspan="2">主单信息:</td> </tr> <TR> <TD>供应商id:</TD> <TD><input name="username" id="username" onblur="checkUserName()" /> <span id="username1"></span> </TD> </TR> </table> </div> </form>第二步,有个对应的js文件,我是外部导入的
function checkUserName() { var username = $("input[name='username").val(); var reg = /^\d+$/; if (username.match(reg)) { $.post("validateVenderID!checkIt.action", { username : username }, function(result) { $("#username1").text(result); if (result == "这个供应商确实是本公司的友商哦") { $("#username1").css("color", "green"); } else if (result == "你说的这个供应商,本公司还不认识") { $("#username1").css("color", "yellow"); } }) return true; } else { $("#username1").text("必须为整数哦,不能为空!"); $("#username1").css("color", "red"); return false; } }第三步,跳转到validateVenderID这个action里的checkIt方法里去;
public class ValidateVenderIDAction { private Integer username; private IVenderIDService venderIDService;
public void checkIt() { Vender v = venderIDService.check(username); PrintWriter pw = null; try { pw = ServletActionContext.getResponse().getWriter(); } catch (IOException e) { e.printStackTrace(); } if (v == null) { pw.write("你说的这个供应商,本公司还不认识"); } else { pw.write("这个供应商确实是本公司的友商哦"); } pw.flush(); pw.close(); } /** * @return the username */ public Integer getUsername() { return username; } /** * @param username the username to set */ public void setUsername(Integer username) { this.username = username; } /** * @return the venderIDService */ public IVenderIDService getVenderIDService() { return venderIDService; } /** * @param venderIDService the venderIDService to set */ public void setVenderIDService(IVenderIDService venderIDService) { this.venderIDService = venderIDService; }}
因为用了ssm的整合框架,全都贴出来费事,就贴个关键的Mapper.xml文件吧
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace="com.aowin.dao.IVenderIDDao"> <select id="check" parameterType="com.aowin.model.Vender" resultType="com.aowin.model.Vender"> select * from vender where vender_id=#{venderID} </select> </mapper>最后一步,配置Struts.xml(这里action实例通过spring容器生成,class只要写类名就行了)
<action name="validateVenderID" class="validateVenderIDAction"> </action>好啦,jQuery配合ajax技术的基础入门版就这样了,以后还会有进阶更好的方式传输数据的!