AJax请求

Ajax请求

例子1:

function toQuesion(id){

var ids = id;

var urlVal="/servlet/ExportWebpart?function=default";//访问后台的相关代码类

$.ajax({

url:urlVal,//请求路径

type:"post",//请求方式

cache:false,//浏览器缓存

dataType:'json',//返回值类型

data:{'expId':ids},//传递到后台的参数值

success:function(json,textStatus){

if(json != null ){

//json.data.error 表示后台自己定义的一个返回值类型

if(json.data.error=="1"){

$("#zjzx").hide();

$("#expert_online").show();

varlist = json.listexpers;//获取所有的专家列表

varcurrentExpert = json.datas;//当前选中的专家

var currentExpId = currentExpert.expid;//当前专家的Id编号

var html = "";//option的值

//for(varpinjson){ //等价于 for循环吗？网上搜索到...

for(vari = 0 ;i<list.length;i++){

varexpert = list[i];

varexpertId = expert.expid;//专家编码

varexpertName = expert.name;//专家姓名

if(currentExpId== expertId){

html ="<option value='" + expertId +"' selected='selected' >" +expertName +"</option>";

}else{

html="<option value='" + expertId + "'>" +expertName +"</option>";

}

$("#chooseExper").append(html);

}

showServerMsg("发送成功！");//JS中封装的一个弹出层吧

}

}else{

showServerMsg("留言信息提交失败！");

}

},

error:function(){

showServerMsg("【系统信息】 请求失败，请重试！");

}

});

例子2:

这个例子主要讲的还是异步请求 同时包含对重要数据加码

functionsubmitBtn(){

var expId =$("#chooseExper").val();//专家编号

//expId = encodeURI(encodeURI(expId));

var expcontent =$("#expcontent").val();//提问内容

//expcontent = encodeURI(encodeURI(expcontent));//encodeURI即为加码函数

var yzm = $("#yzm").val();//验证码

//yzm = encodeURI(encodeURI(yzm));

if(expcontent==''){

alert("请输入内容,内容不能为空！");

$("#expcontent").focus();

return;

}

if(yzm==''){

//alert("请输入验证码,验证码不能为空！");

alert("验证码不能为空！",null,{title:"提示信息",afterHide:function(){$("#yzm").focus();}});

$("#yzm").focus();

return;

}

//异步发出请求

$.ajax({

type:"post",//请求方式

url:"/servlet/ExportWebpart?function=AddExpQuestion",//请求路径

data:{

"expertId":expId,

"expcontent":encodeURI(expcontent),//对字符串需加码，在后台进行解码

"yzm":yzm

},//传递到后台的参数值

dataType:'json',//返回的数据格式

success:function (json) {

vardatainfo = json.data;//获取后台的数据

var error_no =datainfo.error;//错误编号 0 表示成功-1 表示验证码有误

if(error_no =='-1'){

//window.top.verifycodeiframe2.location.reload();

showImage();//调用刷新图片事件

$("#yzm").focus();

alert(datainfo.msg);

}else if(error_no=='1'){

alert(datainfo.msg);

location.href="";

}else if(error_no=='0'){

alert("我们已经收到你的问题，将尽快审核以及回复！");

location.href="/main/khfw/zjzx/index.shtml";

}

}

});

}

3、后台得到Ajax请求需要处理的代码类：

public ActionResult doAddExpQuestion(){ String expId = this.getStrParameter("expertId");//专家Id String twQuesion = this.getStrParameter("expcontent");//提问内容 String yzm = this.getStrParameter("yzm");//验证码内容 String zqyzm = SessionHelper.getString(Constants.TICKET,getSession());// 获取验证码 try { JSONObject json = new JSONObject();//用于向前台返回数据格式 DaTarow data = new DaTarow();//用于保存数据 返回到前台 //校验非空 if(StringHelper.isNotBlank(expId)){ expId = java.net.URLDecoder.decode(expId,"UTF-8"); //解码 } if(StringHelper.isNotBlank(twQuesion)){ twQuesion = java.net.URLDecoder.decode(twQuesion,"UTF-8"); } //如果验证码正确 if(yzm.equalsIgnoreCase(zqyzm)){ //调用Services层的新增方法 此处的返回格式为 DaTarow DaTarow datas = questionService.addQuersion(expId,twQuesion); //根据后台返回是否新增成功来判断是否执行下一步 if(datas.getString("error") != "1"){ data.set("error","1"); data.set("msg","数据库请求失败!!!"); json.put("data",data);//此处json中保存的即是 error 和 msg //对专家提问内容监听 StateMap.put("exp_content","xx向专家提问请求失败..."); }else{ //新增成功！ data.set("error","0"); json.put("data",data); //对专家提问内容监听 StateMap.put("exp_content","xx在"+new Date()+"专家提问,请相应的专家登录系统审核并进行回复..."); } }else{ //验证码有误 data.set("error","-1"); data.set("msg","验证码有误..."); json.put("data","xx在向专家提问过程中,输入的验证码有误..."); } //将相应json数据保存 打印在前台 PrintWriter printer = null; printer = getResponse().getWriter(); printer.write(json.toString()); printer.flush(); printer.close(); printer = null; } catch (Exception e) { e.printstacktrace(); } return null; }