WEB中AJAX实例

本文仅仅是个人喜欢用的一种AJAX方式，个人感觉简单易懂，项目基于SSI框架。本例中没有导入该代码依赖的类，因为没有引入第三方JAR包，把代码拷到myeclipse中，提示你缺少什么类，你就导入什么类就行了。
从前往后代码如下：
本例是当用户在输入框中输入值的时候实时去后台数据库中查询相关信息
使用到的插件或者JS文件如下：
jquery-1.8.3.min.js
jquery.artDialog.js //弹窗插件
iframeTools.source.js //弹窗插件
1.前台代码：

$("#dls_id").on("keyup",function(){
    var dls_id = $("#dls_id").val();
    if(dls_id == ''){//输入的值为空，则返回，不做任何处理
        return false;
    }
    $.ajax({
        url:'ajaxOtmQueryDlsInfo.action', //后台查询的ACTION
        type:'post',//POST方式传递参数从前端到后台
        dataType:'json',//数据类型为JSON
        data:{'dls_id':dls_id},//传输的数据
        success:function(res){
            if(res.success==0){
                //后台代码处理成功你的业务逻辑代码
                //这里是给ID为"dls_name"的输入框赋值
                //该值来自于后台的查询结果
                $("#dls_name").html(res.dlsName);
            }else{
                //后台代码执行异常了你的业务逻辑代码
                //这里是选择把后台异常信息以弹窗的形式展示给用户
                art.dialog.alert(res.msg);
            }
        },
        error:function(){//这里是AJAX发生错误的处理代码
            art.dialog.alert("系统异常！",'error');
        }
    });
});

2.后台代码如下：

/**
     * 输入代理商ID查找代理商信息
     * @return
     * @throws Exception
     */
    public String ajaxOtmQueryDlsInfo() throws Exception{
        log.info("进入ajaxOtmQueryDlsInfo");
        BasOtmBean bean = new BasOtmBean();
        String result = null;
        try{
            //获取代理商ID
            bean.setDlsId(request.getParameter("dls_id"));
            //这里是接口具体的实现类，用来执行真正的业务逻辑，返回了一个JSON数据的toString()之后的字符串(具体内容见下图)
            result = basOtmService.ajaxOtmQueryDlsInfo(bean);
        }catch (BaseException e) {
            log.info(e.getLocalizedMessage());
            result ="{\"error\":\"-1\",\"msg\":\""+e.getLocalizedMessage()+"\"}";
        }catch (Exception e) {
            log.error(e.getMessage(),e);
            result="{\"error\":\"-1\",\"msg\":\""+Constants.SYS_FAIL_MSG+"\"}";
        }finally{
            log.info("离开ajaxOtmQueryDlsInfo");
        }
        this.writerToClient(result);//该方法用于向页面返回处理结果(也可以用于HTTP接口向对方返回处理结果，代码见下方)
        return null;
    }

writerToClient(result)方法：

protected void writerToClient(String context) {
        response.setContentType("text/html; charset=UTF-8");
        PrintWriter out = null;
        try {
            out = response.getWriter();
            log.info("Ajax输出数据: " + context);
            out.write(context);
        } catch (IOException e) {
            log.info("ajax输出错误,请重新再试!");
        }finally{
            if(out != null){
                out.flush();
                out.close();
            }
        }

    }