JQuery中Ajax详细参数使用案例

参考文档:http://www.jb51.net/shouce/jquery1.82/

参考文档:http://jquery.cuishifeng.cn/jQuery.Ajax.html

注意事项

本案例演示测试了官方文档中不常用的参数使用方法

前端代码

function theFileUploadGai() {//执行上传
var zhi={
"a1":["你好啊","こんにちは","hello"],
"a2":["2017年11月1日",true],
"a3":"false",
"a5":[27,"testStr"]
};//手动生成一个Json格式的对象 注意键必须有引号
/** Jquery 参考API版本1.8.2*/
/** jqXHR对象是jQuery自己伪造的一个XMLHttpRequest对象和$.Deferred对象的结合体 参考http://www.365mini.com/page/jquery-jqxhr-object.htm*/
$.ajax({
url: "downparaJson.do",//绝对地址/相对地址
type: 'POST',//不乱码
data: zhi,//发送到服务器的数据 支持JS的Object/String 将自动转换为请求字符串格式。但GET 请求中将附加在 URL 后
async:false,//启用同步
cache: false,//不使用浏览器缓存 每次请求
//dataType : "json",//预期服务器返回的数据类型xml html script json jsonp text
beforeSend: function(jqXHR){//发送请求前可修改XMLHttpRequest对象?数据处理
console.log("beforeSend msg:发送请求前正在处理数据");
if(1<2){
console.log("beforeSend 判断XHR对象:"+(jqXHR instanceof XMLHttpRequest) +"并打印jqXHR");// false
console.log(
jqXHR.readyState+" "+
jqXHR.status+" "+ //返回的HTTP状态码,比如常见的404,500等错误代码。
jqXHR.statusText+" "+ //对应状态码的错误信息,
jqXHR.responseText ); //服务器响应返回的文本信息
return true;
}else{return false;}//返回false可以取消本次ajax请求
},
dataFilter:function (dataOriginal, type) { //对Ajax返回的原始数据进行预处理 type指上面dataType:的值
console.log("dataFilter msg:现在在处理服务器返回的原始数据");
if(type=="json"){//注意dataOriginal 始终是字符串 必须再转换为字符串系统再度处理
//console.log(typeof dataOriginal);//String
var jsObj=JSON.parse(dataOriginal);
jsObj["newData"]=["新的",true,10000];
var zhi=JSON.stringify(jsObj);
return zhi;
}
return dataOriginal; // 返回处理后的数据
},
success: function (data,textStatus,jqXHR) {//status的值是 "success"
console.log(JSON.stringify(data,null,4)+" "+
jqXHR.readyState+" "+
jqXHR.status+" "+ //返回的HTTP状态码,比如常见的404,500等错误代码。
jqXHR.statusText+" "+ //对应状态码的错误信息,
jqXHR.responseText +" "+ //服务器响应返回的文本信息
textStatus);
//console.log(data.Datalist2[1]);//可以这样直接解析Json
console.log('success msg:请求后成功');
},
error: function (jqXHR,textStatus,errorThrown) {//error的值是 "error" 可以用错误链接地址触发
console.log(
jqXHR.readyState+" "+
jqXHR.status+" "+ //返回的HTTP状态码,比如常见的404,500等错误代码。
jqXHR.statusText+" "+ //对应状态码的错误信息,比如404错误信息是not found,500是Internal Server Error。
jqXHR.responseText +" "+ //服务器响应返回的文本信息
textStatus+" "+//表示返回的状态字符串 除了 null还可能是 "timeout","error","notmodified","parsererror"解析异常,"abort"中止
errorThrown);//表示服务器抛出返回的错误信息 字符串
console.log('error msg:请求后发生错误');
},
statusCode:{//一组数值的HTTP代码和函数对象,当响应时调用了相应的代码
404: function() {console.log('statusCode 404:报404错误');},
200: function() {console.log('statusCode 200:请求成功');}
},//不常用
complete: function (jqXHR, textStatus) {//请求完成后回调函数 不论成功/失败
console.log(
jqXHR.readyState+" "+
jqXHR.status+" "+ //返回的HTTP状态码,比如常见的404,500等错误代码。
jqXHR.statusText+" "+ //对应状态码的错误信息,比如404错误信息是not found,500是Internal Server Error。
jqXHR.responseText +" "+ //服务器响应返回的文本信息
textStatus);//表示返回的状态字符串 "success"
},
headers:{"Sysversion":"ios10.0"}, //一个额外的"{键:值}"对映射到请求一起发送 此设置被设置之前beforeSend函数被调用
//contentType :"application/x-www-form-urlencoded",//发送信息至服务器时内容编码类型 加这个会追加到URL链接后面乱码
timeout:60000,//设置请求超时时间(毫秒) 60000毫秒=60秒
username:"wang",//用于响应HTTP访问认证请求的用户名
password:"12345678",//用于响应HTTP访问认证请求的密码
});
}

后台代码

@RequestMapping("downpara.do")
public void downpara(HttpServletRequest request,HttpServletResponse response) throws IOException{
Map map=request.getParameterMap();//api文档写的是<String, String[]>类型
Iterator<Entry<String, String[]>> entries = map.entrySet().iterator();
String aa="";
while (entries.hasNext()) {
Entry<String, String[]> entry = entries.next();
String bb=" "+entry.getKey()+"="+ CommonUtils.toString(entry.getValue(),"");
System.out.println(bb);
aa=aa+bb;
}
//System.out.println(map.containsKey("a1")); //false
//System.out.println(map.containsKey("a1[]"));//true
response.setContentType("text/html;charset=utf-8");
response.getWriter().write(aa);
}
/**异步上传参数 返回Json字符串*/
@RequestMapping("downparaJson.do")
public void downparaJson(HttpServletRequest request,HttpServletResponse response) throws IOException{
Map map=request.getParameterMap();//api文档写的是<String, String[]>类型
Iterator<Entry<String, String[]>> entries = map.entrySet().iterator();
String aa="";
while (entries.hasNext()) {
Entry<String, String[]> entry = entries.next();
String bb=" "+entry.getKey()+"="+ CommonUtils.toString(entry.getValue(),"");
System.out.println(bb);
aa=aa+bb;
}
SimpleDateFormat dateFormater = new SimpleDateFormat("yyyy-MM-dd");
JSONObject jsonAll=new JSONObject();
jsonAll.put("ReturnValue", 0);
jsonAll.put("MSG", "参数正确");
JSONArray jsonarr=new JSONArray();
Object[] shuzu=new Object[]{"大学英语","2016-09-09",21,false};
jsonAll.put("Datalist2", jsonarr.fromObject(shuzu));
response.setContentType("application/json;charset=utf-8");
response.getWriter().write(jsonAll.toString());
}

测试结果

返回类型是Json的情况

url=“downparaJson.do”

返回类型是字符串的情况

url=“downpara.do”

JQuery中Ajax详细参数使用案例的更多相关文章

  1. jQuery中$.ajax()方法参数解析

    本文实例为大家讲解了jQuery $.ajax()方法参数,供大家参考,具体内容如下 $.ajax({ url:'test.do', data:{id:123,name:'xiaoming'}, ty ...

  2. JQuery中$.ajax()方法参数详解

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  3. JQuery中$.ajax()方法参数详解 及 async属性说明

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  4. JQuery中$.ajax()方法参数详解(转载)

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  5. JQuery中$.ajax()方法参数都有哪些?

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  6. 转:JQuery中$.ajax()方法参数详解

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  7. JQuery中$.ajax()方法参数

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  8. (转)JQuery中$.ajax()方法参数详解

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  9. jquery 中ajax的参数

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

随机推荐

  1. jodd-servlet工具集锦

    Jodd提供了许多servlet和jsp相关的工具. Utils ServletUtils类集成了不同的servlet工具,你可以检测multipart请求,读取授权头,下载预备,cookie操作,读 ...

  2. 企业部署Linux应用将拥有更低的TCO

    650) this.width=650;" onclick='window.open("http://blog.51cto.com/viewpic.php?refimg=" ...

  3. DG查看恢复进度

    查看恢复进度 (1)查看进程的活动状态 V$MANAGED_STANDBY视图专用于显示物理Standby数据库相关进程的当前状态,该视图中的列也很有特点,查看进程状态时,通常我们会关注PROCESS ...

  4. var、let和const的区别

    var 首先var有变量提升 console.log(a); // undefined var a = 1; function也存在提升现象 console.log(b); //function b( ...

  5. Robot Framework初步使用

    第一步,新建一个Project:

  6. Vijos——T1279 Leave-绿光

    https://vijos.org/p/1279 背景 期待这一份幸运,和一份冲劲,多么奇妙的际遇…….燕姿在演唱完绿光这首歌后,出给了姿迷一个考题. 北欧有一个传说!人一生中能看见绿光!他就一生都可 ...

  7. 【SSH学习笔记】—从配置Struts1环境到简单实例

    以下我将从一个简单点的计算器实例,介绍struts1的环境配置,以及其重要的两个核心类:ActionForm和Action  简单计算器实现思路: 1.提供一个输入界面,输入两个数字和运算符(+.-. ...

  8. html中的瀑布流是什么

    html中的瀑布流是什么 一.总结 1.瀑布流: 从左往右排列,哪一列现在的总高度最小,就优先排序把item(单元格)放在这一列.这样排完所有的单元格后,可以保证每一列的总高度都相差不大 2.看效果图 ...

  9. iOS Threading编程指南 官方文档翻译第一篇(序言)

    序言   Thread是能够使多个code paths 在同一个APP内并发运行的几种技术之一.虽然新的技术为并发运行提供了先进.高效的工具(例如operation 对象和GCD),但是OS X和iO ...

  10. 12. ZooKeeper之Java客户端API使用—创建会话。

    转自:https://blog.csdn.net/en_joker/article/details/78686649 客户端可以通过创建一个ZooKeeper(org.apache.zookeeper ...