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

合集下载

jquery $.ajax 同步调用 实现原理

jquery $.ajax 同步调用 实现原理

jquery $.ajax 同步调用实现原理jQuery .ajax 同步调用实现原理在前端开发中,经常会涉及到使用Ajax进行异步请求。

而jQuery库中的.ajax()方法是非常常用的一种实现方式。

.ajax()方法使用起来非常方便,可以对数据进行异步请求,并且可以设置回调函数来处理返回的数据。

但是有时候我们需要在请求完成之前进行一些操作,此时可以使用同步调用的方式来实现。

本文将详细介绍使用jQuery .ajax()方法进行同步请求的实现原理。

1. .ajax()方法简介.ajax()是jQuery库中用于发送HTTP请求的核心方法。

它是一个异步方法,可以向服务器发送GET、POST等请求,并处理服务器返回的数据。

.ajax()方法使用一个包含键值对的配置对象作为参数,可以设置请求的地址、请求方式、请求参数、回调函数等。

当请求完成时,可以在回调函数中处理返回的数据。

2. 异步请求与同步请求的区别在讲解实现原理之前,我们先来了解一下异步请求和同步请求的区别:- 异步请求:是指在发送请求的同时,主线程不会阻塞,而是继续执行后续的代码。

当请求完成后,会通过回调函数来处理返回的数据。

异步请求一般使用于需要较长时间才能返回结果的场景,如网络请求、文件上传等。

- 同步请求:是指在发送请求的同时,主线程会一直等待请求的响应结果,而不会继续执行后续的代码。

只有在请求完成后,才会继续执行下面的代码。

同步请求一般使用于需要立即获取结果的场景,如表单提交、页面加载等。

在默认情况下,.ajax()方法是异步请求的,即发送请求后会继续执行后续的代码。

而实现同步请求则需要额外的设置。

3. 同步请求的设置要实现同步请求,可以通过设置.ajax()方法的async选项为false来实现。

async的默认值为true,表示异步请求,当设置为false时表示同步请求。

示例代码:javascript.ajax({url: 'example',async: false,其他配置项...success: function(data) {处理返回的数据}});4. 同步请求的实现原理实现同步请求的关键在于事先知道请求需要的时间,以便正确地进行阻塞。

ajax中访问aspx.cs静态方法

ajax中访问aspx.cs静态方法
} < /script>
三、时间问题
WCF 或 模拟Web服务处理JSON时返回时间格式问题。解决方法如下:
// 杂乱的时间
var rawDate = "/Date(1347120000000+0800)/";
// 提取时间字符串
var strDate = rawDate.substr(6, 13);
}
});
alert(data.d);//返回的数据用data.d获取内容 d是 webservice返回的json对象的属性(包含你return 返回的内容),其他内容都放在d属性里面
},
error: function(err) {
// 把时间字符串转化成int类型
var intDate = parseInt(ate);
// 构造一个Date对象
var newDate = new Date(intDate);
// 将时间转化成当地时间格式
var myDate = newDate.toLocaleDateString();
}
前台页面代码:
<form id="form1" runat="server">
<div>
<asp:Button ID="btn" runat="server" Text="验证用户" />
</div>
</form>
Javascript代码:
$(function() {
alert(err);

Ajax请求的参数

Ajax请求的参数

Ajax请求的参数post请求和get请求存放参数位置post请求和get请求存放参数位置是不同的:post⽅式参数存放在请求数据包的消息体中。

get⽅式参数存放在请求数据包的请求⾏的URI字段中,以?开始以param=value&param2=value2的形式附加在URI字段之后。

⽽request.setCharacterEncoding(charset);只对消息体中的数据起作⽤,对于URI字段中的参数不起作⽤。

get⽤new String(target.trim().getBytes("ISO-8859-1"), charset);---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------get请求的参数$.ajax({url : SITE_PATH + "/userLogRecord/getList3?name1=name&name2=name2",type : 'GET',dataType : 'json',data:{name3:"name3"},success : function(data) {console.log(111111);},error : function(msg) {}});1、没有search也没有data,即标准的⽆参数get请求,这种既然没有参数,当然也就不涉及content-Type(请求参数data的数据类型)。

Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结

Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
});
四, $复.g制et代JS码O
代码如下:
$.getJSO N("data. $("#getJ S所ON以Re调sp用o 时需要使
);
When Ajax 载入静态 页面 load( url, (dSatraing) (cMaalpl)b(a可ck (Callbac load()方 法可以轻 复制代码
代码如下:
$("#load ing").aj $(t}h)i;s).
全局事件 也 复可制以代帮码
代码如下:
$("#msg" ).before $(t}h)i.sa)j.a xSuccess $(t}h)i.sa)j.a xError(f $}()t;his).
很显然, 第 复三制个代参码
代码如下:
$.ajax({
进一步了 解 前A面JA讨X事论 的一些方 ajaxStar t(全局事 件 be)fo开re始Se n(d局部事 件 a(j全)ax局当Se事一nd 件 s(u局)cc部请es事求s 件 aj)ax请Su求cc e全ss局事件 全 e(r局局ro部的r事请 件 aj)ax仅Er当ro r
全局事件 全 c(o局局mp部的le事发te 件 aj)ax不Co管mp l全et局e事件 全 a(j全局ax局的St事请op 件 局)部当事没件 在之前的 复制代码
代码如下:
$('#ajax 这样, d复at制a.代ht码m
代码如下:
$('#ajax -
实现GET 和POST方 get( url, (dSatraing) (cMaalpl)b(a可ck (Callbac 很显然这 是一个专 复制代码
代码如下:
$.get('l ogin.pihdp

ajax传值,jQuery.ajax,json格式转化和前台后台传值

ajax传值,jQuery.ajax,json格式转化和前台后台传值

1.ajax传输用字符串,后台接收参数用request.getParameter,所以前台必须有Parameter 如"/FirstServlet/regPage?countryId=" + countryId2.后台向前台传参数通过response,PrintWriter pw = resp.getWriter();pw.print(“df”);前台接收参数用var txt = xhr.responseText;3.如果用json字符串传输前台用jQuery.ajax是如下data : {'mydata':jsonStr},jQuery.ajax({type: "post",url: url,dataType : 'json',data : {'mydata':jsonStr},success: function(data,textStatus){alert("操作成功");},error: function(xhr,status,errMsg){alert("操作失败!");}});后台一样用request如String jsonStr = ServletActionContext.getRequest().getParameter("mydata");4.后台向前台传值一样用response如pw.print(jsonList.toString());前台接收jQuery用success: function(data,textStatus)data就是一个json(自动将json字符串转化为了json)5.json与json字符串之间的转化json的格式两种:数组["hello", 12, true , null];和对象{ "color": "red", "doors" : 4, "paidFor" : true };前台:json-json字符串JSON.stringify(jsonobj);$("#form").serialize()//表单转化为json字符串json字符串-jsoneval('(' + jsonstr + ')');JSON.parse(jsonstr);使用Function对象来进行返回解析function(data,textStatus){后台:json-json字符串jsonObj.toString()json字符串-jsonJSONObject obj1 = JSONObject.fromObject("{'dsaf':'uuuu'}");JSONObject obj = JSONObject.fromObject(address);//把对象转化为json。

$.ajax使用方法

$.ajax使用方法

$.ajax使用方法$.ajax是jQuery中的一个方法,用于执行异步HTTP(Ajax)请求。

以下是$.ajax的基本使用方法:1.创建请求:```javascript$.ajax({url:"example.php",//请求的URL地址type:"GET",//请求方式,GET或POST dataType:"json",//预期服务器返回的数据类型,可以是xml、json、script、html等success:function(data){//请求成功后的回调函数console.log(data);//输出服务器返回的数据},error:function(){//请求失败时的回调函数console.log("请求失败");}});```2.发送数据:```javascript$.ajax({url:"example.php",type:"POST",data:{foo:"bar"},//要发送到服务器的数据,以键值对的形式表示dataType:"json",success:function(data){console.log(data);},error:function(){console.log("请求失败");}});```3.处理服务器响应:在成功回调函数中,服务器返回的数据作为参数传递给回调函数。

可以根据需要处理这些数据,例如更新页面内容或执行其他操作。

4.配置选项:$.ajax方法接受一个配置对象作为参数,其中包含以下选项:-`url`:请求的URL地址。

-`type`:请求方式,默认为"GET"。

-`dataType`:预期服务器返回的数据类型,默认为"html"。

js jquery ajax的用法

js jquery ajax的用法

js jquery ajax的用法jQuery是一个快速、简洁的JavaScript库,它封装了用于处理事件、AJAX、DOM操作等的方法,使得JavaScript编写代码的复杂性大大降低。

其中,AJAX是一种网页异步传输数据的技术,在不重新加载页面的情况下向服务器请求并获取数据。

使用jQuery进行AJAX请求需要使用jQuery库的$.ajax()方法。

该方法有多个参数,下面介绍几个主要的参数:1. url:表示服务器处理请求的地址,必填项;2. type:表示发送请求的方式,包括“GET”和“POST”,默认为“GET”;3. data:表示要发送的数据,可以为一个对象、字符串或者数组;4. dataType:表示服务器返回的数据类型,常用的包括“xml”、“json”和“html”;5. success:AJAX请求成功时的回调函数,函数中返回的数据即为后台返回的数据;6. error:AJAX请求失败时的回调函数。

下面是一个示例代码:```$.ajax({url: '/api/data',type: 'GET',data: { page: 1 },dataType: 'json',success: function (data) {(data);},error: function (xhr, status, error) {(error);}});```上述代码中,发送了一个GET请求到‘/api/data’地址,请求参数为{page:1},数据类型为json。

如果请求成功,将返回的数据打印在console中,否则打印错误信息。

除了$.ajax()方法之外,jQuery还提供了一些常用的AJAX快捷方法,例如$.get()、$.post()、$.getJSON()等。

这些方法都是对$.ajax()的封装,使用方法更加简单。

例如,使用$.get()方法获取响应数据可以这样实现:```$.get('/api/data', { page: 1 }, function (data) {(data);}, 'json');```上述代码中,发送了一个GET请求到‘/api/data’地址,请求参数为{page:1},数据类型为json。

ajax 调用方法

ajax 调用方法

ajax 调用方法Ajax调用方法详解Ajax(Asynchronous JavaScript and XML)是一种用于创建快速动态网页的技术,它通过在后台与服务器进行少量数据交换,实现了网页无需刷新即可更新部分内容的功能。

在前端开发中,Ajax的应用非常广泛,本文将详细介绍几种常见的Ajax调用方法。

一、XMLHttpRequest对象XMLHttpRequest是Ajax的核心对象,它用于与服务器进行数据交互。

通过创建XMLHttpRequest对象并调用其相关方法,可以实现异步加载数据、发送数据到服务器等操作。

创建XMLHttpRequest对象的方法如下:```javascriptvar xhr;if (window.XMLHttpRequest) {xhr = new XMLHttpRequest(); // 非IE浏览器} else if (window.ActiveXObject) {xhr = new ActiveXObject('Microsoft.XMLHTTP'); // IE浏览器}```使用XMLHttpRequest对象发送GET请求的方法如下:```javascriptxhr.open('GET', 'data.php?param1=value1&param2=value2', true);xhr.onreadystatechange = function() {if (xhr.readyState === 4 && xhr.status === 200) {var response = xhr.responseText;// 处理服务器返回的数据}};xhr.send();```使用XMLHttpRequest对象发送POST请求的方法如下:```javascriptxhr.open('POST', 'data.php', true);xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');xhr.onreadystatechange = function() {if (xhr.readyState === 4 && xhr.status === 200) {var response = xhr.responseText;// 处理服务器返回的数据};xhr.send('param1=value1&param2=value2');```二、jQuery的Ajax方法jQuery是一款功能强大的JavaScript库,它封装了许多常用的操作,包括Ajax。

jQuery Ajax 实例 全解析

jQuery Ajax 实例 全解析

jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯。

废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法,当然,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()的(这个后面会说到).1. load( url, [data], [callback] ) :载入远程HTML 文件代码并插入至DOM 中。

url (String) : 请求的HTML页的URL地址。

data (Map) : (可选参数) 发送至服务器的key/value 数据。

callback (Callback) : (可选参数) 请求完成时(不需要是success的)的回调函数。

这个方法默认使用GET 方式来传递的,如果[data]参数有传递数据进去,就会自动转换为POST方式的。

jQuery 1.2 中,可以指定选择符,来筛选载入的HTML 文档,DOM 中将仅插入筛选出的HTML 代码。

语法形如"url #some > selector"。

这个方法可以很方便的动态加载一些HTML文件,例如表单。

示例代码:$(".ajax.load").load("/yeer/archive/2009/06/10/ 1500682.html .post",function (responseText, textStatus, XMLHttpRequest){this;//在这里this指向的是当前的DOM对象,即$(".ajax.load")[0]//alert(responseText);//请求返回的内容//alert(textStatus);//请求状态:success,error//alert(XMLHttpRequest);//XMLHttpRequest对象});这里将显示结果。

jquery中ajax请求的使用和四个步骤示例

jquery中ajax请求的使用和四个步骤示例

jquery中ajax请求的使⽤和四个步骤⽰例ajax() ⽅法⽤于执⾏ AJAX(异步 HTTP)请求,所有的 jQuery AJAX ⽅法都使⽤ ajax() ⽅法,该⽅法通常⽤于其他⽅法不能完成的请求。

基本的语法是:$.ajax({name:value, name:value, … })下⾯是通常使⽤的⽰例:$.ajax({type:'POST', // 规定请求的类型(GET 或 POST)url:uploadV, // 请求的url地址dataType:'json', //预期的服务器响应的数据类型data:{},//规定要发送到服务器的数据beforeSend:function(){ //发送请求前运⾏的函数(发送之前就会进⼊这个函数)// ....},success: function(result){ // 当请求成功时运⾏的函数//...},error:function(result){ //失败的函数//...},complete:function(){ //请求完成时运⾏的函数(在请求成功或失败之后均调⽤,即在 success 和 error 函数之后,不管成功还是失败都会进这个函数) // ...}});如果还需要其他参数,参考下⾯列举的⼀下其他的可以⽤到的名称和值:名称值/描述async布尔值,表⽰请求是否异步处理。

默认是 true。

beforeSend(xhr)发送请求前运⾏的函数。

cache布尔值,表⽰浏览器是否缓存被请求页⾯。

默认是 true。

complete(xhr,status)请求完成时运⾏的函数(在请求成功或失败之后均调⽤,即在 success 和 error 函数之后)。

contentType发送数据到服务器时所使⽤的内容类型。

默认是:”application/x-www-form-urlencoded”。

context为所有 AJAX 相关的回调函数规定 “this” 值。

jQueryAjax精品PPT课件

jQueryAjax精品PPT课件

$.ajax()方法
回调函数
1. beforeSend 在发送请求之前调用,并且传入一个 XMLHttpRequest作为参数。
2. error 在请求出错时调用。传入XMLHttpRequest对象,描 述错误类型的字符串以及一个异常对象(如果有的话)
3. dataFilter 在请求成功之后调用。传入返回的数据以及 "dataType"参数的值。并且必须返回新的数据(可能是处 理过的)传递给success回调函数。
data - 包含来自请求的结果数据 textstatus - 包含请求的状态("success", "notmodified", "error", "timeout" 或 "parsererror")
只有ajax请求成功后,才触发回调函数 type: 返回内容格式,xml, html, script, json, text, _default
$.getScript()方法
$.getScript(url, [callback]) 动态加载外部js文件并自动执行 打开
url: 待载入 JS 文件地址。 callback: 成功载入后回调函数。
$.getJSON ()方法
$.getJSON(url, [data], [callback]) 加载外部JSON数据文件 打开
jQuery Ajax
Ajax
1. 最底层的方法:$.ajax() 2. 第2层的方法:load()、$.get() 、$.post() 3. 第3层的方法:$.getScript()、$.getJSON()
load()方法
load(url, [data], [callback]) url: 待装入 HTML 网页网址。 data: 发送至服务器的 key/value 数据。也可以接受一个字 符串。 callback: 载入成功时回调函数。打开

Flask的jsonify模块、json前后端交互数据、$.ajax()方法详解

Flask的jsonify模块、json前后端交互数据、$.ajax()方法详解

Flask的jsonify模块、json前后端交互数据、$.ajax()⽅法详解⼀、Flask中可以使⽤Python⾃带的json模块,也可以使⽤Flask中的jsonify代码⽰例:from flask import Flask, jsonifyapp = Flask(__name__)json_data = [{"name":"json", "age":123}]@app.route('/jsontest', methods=['GET'])def get_json():return jsonify({'data': json_data}) #使⽤jsonify之后会转成对象格式app.run()⼆、JSON 前后端交互数据交互数据概念当数据在浏览器和服务器之间交互时,数据只能是⽂本(也可以理解为字符串格式)JSON属于⽂本,我们需要把JavaScript对象转换成JSON,然后将JSON发送到服务端,也可以从服务器将JSON发送到前端转换成JavaScript对象将JavaScript对象转成JSON格式字符串使⽤JSON.stringify()如果你的数据存储在JavaScript对象中,你需要把该对象转成JSON格式字符串,然后将其发送到服务器。

使⽤JSON.stringify()⽰例:var myObj = { name:"Bill Gates", age:62, city:"Seattle" };var myJSON = JSON.stringify(myObj);window.location = "demo_json.php?x=" + myJSON;将JSON格式字符串转成JavaScript对象使⽤JSON.parse()JSON格式接收到数据,将其转换成JavaScript对象,使⽤:JSON.parse()⽰例:var myJSON = '{ "name":"Bill Gates", "age":62, "city":"Seattle" }';var myObj = JSON.parse(myJSON);document.getElementById("demo").innerHTML = ;三、$.ajax()⽅法详解(常⽤参数)1.url 要求为String类型的参数,(默认为当前页地址)发送请求的地址url: '/labels_csv/'2.type 要求为String类型的参数,请求⽅式(post或get)默认为get。

使用jQuery的ajax方法向服务器发出get和post请求的方法

使用jQuery的ajax方法向服务器发出get和post请求的方法

使⽤jQuery的ajax⽅法向服务器发出get和post请求的⽅法打算写个ajax系列的博⽂,主要是写给⾃⼰看,学习下ajax的相关知识和⽤法,以更好的在⼯作中使⽤ajax。

假设有个⽹站A,它有⼀个简单的输⼊⽤户名的页⾯,界⾯上有两个输⼊框,第⼀个输⼊框包含在⼀个form表单⾥⽤来实现form提交,第⼆个输⼊框是单独的、没有包含在form⾥,下⾯就⽤这两个输⼊框来学习下jQuery的ajax。

1,前端的html和javascript代码页⾯html<main style="text-align: center; margin: 200px auto;"><h2>输⼊⽤户名</h2><form class="" action="demo01.php" method="post" style="margin-bottom: 20px;"><input id="user-name" type="text" name="username" placeholder="请填写您的⽤户名"><input type="submit" name="submit1" value="form提交1" class="input"></form><input id="user-name2" type="text" name="username2" placeholder="请填写您的⽤户名"><input type="button" name="submit2" value="ajax提交2"><div class="box"></div></main><script src="../../js/jquery-3.1.0.min.js"></script><script src="demo.js"></script>页⾯中引⼊的demo01.js代码,注意此处实现的是⼀个简单的GET请求。

Jquery中$.getScript() $.getJSON()和$.ajax()的用法总结

Jquery中$.getScript() $.getJSON()和$.ajax()的用法总结

Jquery中$.getScript() $.getJSON()和$.ajax()的用法总结jQuery 提供了一组用于特定异步加载的方法:$.getScript(),用于加载特定的JS 文件;$.getJSON(),用于专门加载JSON 文件。

有时我们希望能够特定的情况再加载JS 文件,而不是一开始把所有JS 文件都加载了,这时课时使用$.getScript()方法。

//点击按钮后再加载JS 文件$('input').click(function () {$.getScript('test.js');});$.getJSON()方法是专门用于加载JSON 文件的,使用方法和之前的类似。

$('input').click(function () {$.getJSON('test.json', function (response, status, xhr) {alert(response[0].url);}); });$.ajax()$.ajax()是所有ajax 方法中最底层的方法,所有其他方法都是基于$.ajax()方法的封装。

这个方法只有一个参数,传递一个各个功能键值对的对象。

//$.ajax 使用$('input').click(function () {$.ajax({type : 'POST', //这里可以换成GETurl : 'test.php',data : {url : 'ycku' },success : function (response, stutas, xhr) {$('#box').html(response);}});});注意:对于data 属性,如果是GET 模式,可以使用三种之前说所的三种形式。

如果是POST 模式可以使用之前的两种形式。

Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结

Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结

Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的⽤法总结详细解读Jquery各Ajax函数:$.get(),$.post(),$.ajax(),$.getJSON()⼀,$.get(url,[data],[callback])说明:url为请求地址,data为请求数据的列表,callback为请求成功后的回调函数,该函数接受两个参数,第⼀个为服务器返回的数据,第⼆个参数为服务器的状态,是可选参数。

⽽其中,服务器返回数据的格式其实是字符串形势,并不是我们想要的json数据格式,在此引⽤只是为了对⽐说明复制代码代码如下:$.get("data.php",$("#firstName.val()"),function(data){$("#getResponse").html(data); }//返回的data是字符串类型);⼆,$.post(url,[data],[callback],[type])说明:这个函数跟$.get()参数差不多,多了⼀个type参数,type为请求的数据类型,可以是html,xml,json等类型,如果我们设置这个参数为:json,那么返回的格式则是json格式的,如果没有设置,就和$.get()返回的格式⼀样,都是字符串的复制代码代码如下:$.post("data.php",$("#firstName.val()"),function(data){$("#postResponse").html();},"json"//设置了获取数据的类型,所以得到的数据格式为json类型的);三,$.ajax(opiton)说明:$.ajax()这个函数功能强⼤,可以对ajax进⾏许多精确的控制,需要详细说明的请参照相关资料复制代码代码如下:$.ajax({url: "ajax/ajax_selectPicType.aspx",data:{Full:"fu"},type: "POST",dataType:'json',success:CallBack,error:function(er){BackErr(er);}});四,$.getJSON(url,[data],[callback])复制代码代码如下:$.getJSON("data.php",$("#firstName.val()"),function(jsonData){$("#getJSONResponse").html(jsonData.id);}//⽆需设置,直接获取的数据类型为json,所以调⽤时需要使⽤jsonData.id⽅式);When Ajax meets jQuery 基于AJAX的应⽤现在越来越多,⽽对于前台开发⼈员来说,直接和底层的HTTPRequest打交道⼜不是⼀件令⼈愉快的事情。

jquery_ajax_完全使用手册.pdf

jquery_ajax_完全使用手册.pdf

参数: optio ns返回值: xml HttpReq uest使用HTTP请求一个页面。

这是jque ry的低级ajax实现。

要查看高级抽象,见$.set、$.post等,这些方法更易于理解和使用。

但是功能上有限制(例如,没有错误处理函数)。

警告:如果数据类型指定为"scrip t",那么POST自动转化为GET方法。

(因为script会作为一个嵌入页面的script标签进行载入)$.ajax()函数返回它创建的XMLH ttpRequest对象。

在大部分情况下,你不需要直接操作此对象。

通常,这个XMLH ttpReq uest对象主要用于需要手动中断XMLH ttpRequest请求的时候。

注意:如果你指明了下面列出的数据类型,请确保服务端发送了正确的MIME响应类型(如. xml 的类型是"te xt/xml")。

错误的MIME类型能够导致脚本出现意想不到的问题。

请查看AJAX的范例来了解数据类型的更多信息。

$.ajax()函数需要一个参数,一个包含有键/值对的对象,用于初始化并操作请求对象。

在jQue ry 1.2版本中,如果你指明了一个JSONP回调函数,你就可以从其它的域中载入JSON类型的数据,写法类似于"myurl?callback=?" 。

jQuery会自动调用正确的方法名称来代替查询字符串,执行你指定的回调函数。

或者,你也可以指定jso np的数据类型的回调函数,此函数会自动添加到Ajax请求中。

参数选项:async(true) 数据类型: Boolean默认情况下,所有的请求都是异步发送的(默认为true)。

如果需要发送同步请求, 设置选项为false。

注意,同步请求可能会暂时的锁定浏览器, 当请求激活时不能进行任何操作。

beforeSe nd 数据类型: Functio n一个预处理函数用于在发送前修改XMLHttpReq uest对象,设置自定义头部等。

jquery的ajax常用方法

jquery的ajax常用方法
});
else
add(j, jQuery.isFunction(a[j]) ? a[j]() : a[j]);
// 返回生成字符串
return s.join("&").replace(/%20/g, "+");
}
Get&post
// 如果不是字符集串就转换在查询字符集串
if (s.data && s.processData && typeof s.data != "string")
s.data = jQuery.param(s.data);
// 构建jsonp请求字符集串。jsonp是跨域请求,要加上callback=?后面将会加函数名
7.1 jquery的ajax常用方法
对于Ajax原理不深入分析。Jquery肯定也会提供Ajax的实现。对于ajax的请求,可以分成如下的几步:
1、通过 new XMLHttpRequest 或其它的形式(指IE)生成ajax的对象xhr。
2、通过xhr.open(type, url, async, username, password)的形式建立一个连接。
3、通过setRequestHeader设定xhr的请求头部(request header)。
4、通过send(data)请求服务器端的数据。
5、执行在xhr上注册的onreadystatechange回调处理返回数据。
任何的lib都是在这几步之上进行相关扩展而达到自己的功能。这几步之中,对于url,我们要考虑是跨域请求怎么办,ajax为了安全的考虑不支持跨域请求,那么对于这个问题,Jquery和Ext都是采用scriptTag的方式。

JQuery中Ajax的操作完整例子

JQuery中Ajax的操作完整例子

JQuery中Ajax的操作完整例⼦Java软件开发中,后台中我们可以通过各种框架,像SSH等进⾏对代码的封装,⽅便我们对Java代码的编写,例如,Struts,SpringMVC对从前台到action的流程进⾏封装控制,使我们只需要进⾏⼀些简单配置就可以实现;⽽spring进⾏了对各种对象的管理进⾏封装,提供了AOP编程的⽅式,⼤⼤⽅便了我们;⽽hibernate和IBatis则是对JDBC代码进⾏封装,不需要我们每次都写那些重复⽽繁杂的JDBC代码。

前台呢,对于页⾯⼀些效果,验证等,我们都是通过JavaScript语⾔进⾏完成的,但是它也就像我们的Java代码⼀样,是最前台语⾔最基础的,⽽jQuery则是对js代码进⾏封装⽅便我们前台代码的编写,⽽且它还有⼀个⾮常⼤的优势就是解决了浏览器的兼容问题,这也是我们使⽤它⾮常重要的原因之⼀。

⽽现在为了满⾜⽤户的需求,Ajax(Asynchronous Javascript + XML)异步刷新起到了⽆可⽐拟的作⽤,以前写Ajax操作,总是需要我们想JDBC代码⼀样进⾏⼏个必备的步骤:AJAX——核⼼XMLHttpRequest对象,⽽JQuery也对Ajax异步操作进⾏了封装,这⾥看⼀下⼏种常⽤的⽅式。

$.ajax,$.post, $.get, $.getJSON。

⼀, $.ajax,这个是JQuery对ajax封装的最基础步,通过使⽤这个函数可以完成异步通讯的所有功能。

也就是说什么情况下我们都可以通过此⽅法进⾏异步刷新的操作。

但是它的参数较多,有的时候可能会⿇烦⼀些。

看⼀下常⽤的参数:var configObj = {method //数据的提交⽅式:get和posturl //数据的提交路劲async //是否⽀持异步刷新,默认是truedata //需要提交的数据dataType //服务器返回数据的类型,例如xml,String,Json等success //请求成功后的回调函数error //请求失败后的回调函数}$.ajax(configObj);//通过$.ajax函数进⾏调⽤。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

JQuery中$.ajax()方法参数详解
url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址。

type: 要求为String类型的参数,请求方式(post或get)默认为get。

注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。

timeout: 要求为Number类型的参数,设置请求超时时间(毫秒)。

此设置将覆盖$.ajaxSetup()方法的全局设置。

async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求。

如果需要发送同步请求,请将此选项设置为false。

注意,同步请求将锁住浏览器,用户其他操作必须等待请求完成才可以执行。

cache:要求为Boolean类型的参数,默认为true(当dataType为script时,默认为false)。

设置为false将不会从浏览器缓存中加载请求信息。

data: 要求为Object或String类型的参数,发送到服务器的数据。

如果已经不是字符串,将自动转换为字符串格式。

get请求中将附加在url后。

防止这种自动转换,可以查看processData选项。

对象必须为key/value格式,例如
{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。

如果是数组,JQuery 将自动为不同值对应同一个名称。

例如{foo:["bar1","bar2"]}转换为
&foo=bar1&foo=bar2。

dataType: 要求为String类型的参数,预期服务器返回的数据类型。

如果不指定,JQuery将自动根据http包mime信息返回responseXML或responseText,并作为回调函数参数传递。

可用的类型如下:
xml:返回XML文档,可用JQuery处理。

html:返回纯文本HTML信息;包含的script标签会在插入DOM时执行。

script:返回纯文本JavaScript代码。

不会自动缓存结果。

除非设置了cache 参数。

注意在远程请求
时(不在同一个域下),所有post请求都将转为get请求。

json:返回JSON数据。

jsonp:JSONP格式。

使用SONP形式调用函数时,例如myurl?callback=?,JQuery 将自动替换后一个
“?”为正确的函数名,以执行回调函数。

text:返回纯文本字符串。

beforeSend:要求为Function类型的参数,发送请求前可以修改XMLHttpRequest 对象的函数,例如添加自定义HTTP头。

在beforeSend中如果返回false可以取消本次ajax请求。

XMLHttpRequest对象是惟一的参
数。

function(XMLHttpRequest){
this; //调用本次ajax请求时传递的options参数
}
complete:要求为Function类型的参数,请求完成后调用的回调函数(请求成功或失败时均调用)。

参数:XMLHttpRequest对象和一个描述成功请求类型的字符串。

function(XMLHttpRequest, textStatus){
this; //调用本次ajax请求时传递的options参数
}
success:要求为Function类型的参数,请求成功后调用的回调函数,有两个参数。

(1)由服务器返回,并根据dataType参数进行处理后的数据。

(2)描述状态的字符串。

function(data, textStatus){
//data可能是xmlDoc、jsonObj、html、text等等
this; //调用本次ajax请求时传递的options参数
error:要求为Function类型的参数,请求失败时被调用的函数。

该函数有3个参数,即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。

ajax事件函数如下:
function(XMLHttpRequest, textStatus, errorThrown){
//通常情况下textStatus和errorThrown只有其中一个包含信息 this; //调用本次ajax请求时传递的options参数
}
contentType:要求为String类型的参数,当发送信息至服务器时,内容编码类型默认为"application/x-www-form-urlencoded"。

该默认值适合大多数应用场合。

dataFilter:要求为Function类型的参数,给Ajax返回的原始数据进行预处理的函数。

提供data和type两个参数。

data是Ajax返回的原始数据,type是调用jQuery.ajax时提供的dataType参数。

函数返回的值将由jQuery进一步处理。

function(data, type){
//返回处理后的数据
return data;
}
global:要求为Boolean类型的参数,默认为true。

表示是否触发全局ajax事件。

设置为false将不会触发全局ajax事件,ajaxStart或ajaxStop可用于控制各种ajax事件。

ifModified:要求为Boolean类型的参数,默认为false。

仅在服务器数据改变时获取新数据。

服务器数据改变判断的依据是Last-Modified头信息。

默认值是false,即忽略头信息。

jsonp:要求为String类型的参数,在一个jsonp请求中重写回调函数的名字。

该值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分,例如{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给服务器。

username:要求为String类型的参数,用于响应HTTP访问认证请求的用户名。

password:要求为String类型的参数,用于响应HTTP访问认证请求的密码。

processData:要求为Boolean类型的参数,默认为true。

默认情况下,发送的数据将被转换为对象(从技术角度来讲并非字符串)以配合默认内容类型"application/x-www-form-urlencoded"。

如果要发送DOM树信息或者其他不希望转换的信息,请设置为false。

scriptCharset:要求为String类型的参数,只有当请求时dataType为"jsonp"或者"script",并且type是GET时才会用于强制修改字符集(charset)。

通常在本地和远程的内容编码不同时使用。

相关文档
最新文档