搜索
首页web前端前端问答ajax函数是什么

ajax函数是什么

Dec 17, 2021 am 11:24 AM

ajax函数是指jQuery.ajax()函数,该函数用于通过后台HTTP请求加载远程数据,是jQuery封装的AJAX技术实现,通过该函数,我们无需刷新当前页面即可获取远程服务器上的数据。

ajax函数是什么

本文操作环境:Windows7系统,jquery3.2.1版,Dell G3电脑。

ajax函数是什么?

jQuery.ajax() 函数详解

jQuery.ajax()函数用于通过后台HTTP请求加载远程数据

jQuery.ajax()函数是jQuery封装的AJAX技术实现,通过该函数,我们无需刷新当前页面即可获取远程服务器上的数据。

jQuery.ajax()函数是jQuery的底层AJAX实现。jQuery.get()、 jQuery.post()、load()、 jQuery.getJSON()、 jQuery.getScript()等函数都是该函数的简化形式(都调用该函数,只是参数设置有所不同或有所省略)。

该函数属于全局jQuery对象(也可理解为静态函数)。

参数

请根据前面语法部分所定义的参数名称查找对应的参数。

参数 描述
url String类型URL请求字符串。
参数 描述
url String类型URL请求字符串。
settings 可选/Object类型一个Object对象,其中的每个属性用来指定发送请求所需的额外参数设置。
settings 可选/Object类型一个Object对象,其中的每个属性用来指定发送请求所需的额外参数设置。

参数settings是一个对象,jQuery.ajax()可以识别该对象的以下属性(它们都是可选的):

accepts --- Object类型

默认值:取决于dataType属性。

发送的内容类型请求头,用于告诉服务器——浏览器可以接收服务器返回何种类型的响应。

async --- Boolean类型

默认值:true

指示是否是异步请求。同步请求将锁定浏览器,直到获取到远程数据后才能执行其他操作。

beforeSend---Function类型

指定在请求发送前需要执行的回调函数。该函数还有两个参数:其一是jqXHR对象,其二是当前settings对象。这是一个Ajax事件,如果该函数返回false,将取消本次ajax请求。

cache---Boolean类型

默认值:true(dataType为'script'或'jsonp'时,则默认为false)。

指示是否缓存URL请求。如果设为false将强制浏览器不缓存当前URL请求。该参数只对HEAD、GET请求有效(POST请求本身就不会缓存)。

complete---Function/Array类型

指定请求完成(无论成功或失败)后需要执行的回调函数。该函数还有两个参数:一个是jqXHR对象,一个是表示请求状态的字符串('success'、 'notmodified'、 'error'、 'timeout'、 'abort'或'parsererror')。这是一个Ajax事件。

从jQuery 1.5开始,该属性值可以是数组形式的多个函数,每个函数都将被回调执行。

contents---Object类型1.5 新增

一个以"{字符串:正则表达式}"配对的对象,用来确定jQuery将如何解析响应,给定其内容类型。

contentType---String类型

默认值:'application/x-www-form-urlencoded; charset=UTF-8'。

使用指定的内容编码类型将数据发送给服务器。W3C的XMLHttpRequest规范规定charset始终是UTF-8,你如果将其改为其他字符集,也无法强制浏览器更改字符编码。

context---Object类型

用于设置Ajax相关回调函数的上下文对象(也就是函数内的this指针)。

converters --- Object类型1.5 新增

默认值:{'* text': window.String, 'text html': true, 'text json': jQuery.parseJSON, 'text <span id="9_nwp">xml': jQuery.parseXML}<code>{'* text': window.String, 'text html': true, 'text json': jQuery.parseJSON, 'text <span id="9_nwp">xml': jQuery.parseXML}</span>

一个数据类型转换器。每个转换器的值都是一个函数,用于返回响应转化后的值。

crossDomain---Boolean类型1.5 新增

默认值:同域请求为false,跨域请求为true

指示是否是跨域请求。如果你想在同一域中强制跨域请求(如JSONP形式),请设置为true。例如,这允许服务器端重定向到另一个域。

data---任意类型

发送到服务器的数据,它将被自动转为字符串类型。如果是GET请求,它将被附加到URL后面。

dataFilter---Function类型

指定处理响应的原始数据的回调函数。该函数还有两个参数:其一表示响应的原始数据的字符串,其二是<span id="8_nwp">dataType<code><span id="8_nwp">dataType</span>属性字符串。

dataType---String类型

默认值:jQuery智能猜测,猜测范围(xml、 json、 script或html)

指定返回的数据类型。该属性值可以为:

  • 'xml' :返回XML文档,可使用jQuery进行处理。
  • 'html': 返回HTML字符串。
  • 'script': 返回JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意:在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
  • 'json': 返回JSON数据。JSON数据将使用严格的语法进行解析(属性名必须加双引号,所有字符串也必须用双引号),如果解析失败将抛出一个错误。从jQuery 1.9开始,空内容的响应将返回null{}
  • 'jsonp': JSONP格式。使用JSONP形式调用函数时,如"url?callback=?",jQuery将自动替换第二个?为正确的函数名,以执行回调函数。
  • 'text': 返回纯文本字符串。

error---Function/Array类型

指定请求失败时执行的回调函数。该函数有3个参数:jqXHR对象、 请求状态字符串(null、 'timeout'、 'error'、 'abort'和'parsererror')、 错误信息字符串(响应状态的文本描述部分,例如'Not Found'或'Internal Server Error')。这是一个Ajax事件。跨域脚本和跨域JSONP请求不会调用该函数。

从jQuery 1.5开始,该属性值可以是数组形式的多个函数,每个函数都将被回调执行。

global---Boolean类型

默认值:true

指示是否触发全局Ajax事件。将该值设为false将阻止全局事件处理函数被触发,例如ajaxStart()和ajaxStop()。它可以用来控制各种Ajax事件。

headers---Object类型1.5 新增

默认值:{}

以对象形式指定附加的请求头信息。请求头X-Requested-With: XMLHttpRequest将始终被添加,当然你也可以在此处修改默认的XMLHttpRequest值。headers中的值可以覆盖beforeSend回调函数中设置的请求头(意即beforeSend先被调用)。

$.ajax({
    url: "my.php" ,
    headers: {        "Referer": "http://www.365mini.com" // 有些浏览器不允许修改该请求头
        ,"User-Agent": "newLine" // 有些浏览器不允许修改该请求头
        ,"X-Power": "newLine"
        ,"Accept-Language": "en-US"
    }
});

ifModified---Boolean类型

默认值:false

允许当前请求仅在服务器数据改变时获取新数据(如未更改,浏览器从缓存中获取数据)。它使用HTTP头信息Last-Modified来判断。从jQuery 1.4开始,他也会检查服务器指定的'etag'来确定数据是否已被修改。

isLocal---Boolean类型1.5.1 新增

默认值:取决于当前的位置协议。

允许将当前环境视作"本地",(例如文件系统),即使默认情况下jQuery不会如此识别它。目前,以下协议将被视作本地:file*-extensionwidget

jsonp---String类型

重写JSONP请求的回调函数名称。该值用于替代"url?callback=?"中的"callback"部分。

jsonpCallback---String/Function类型

为JSONP请求指定一个回调函数名。这个值将用来取代jQuery自动生成的随机函数名。

从jQuery 1.5开始,你也可以指定一个函数来返回所需的函数名称。

mimeType---String类型1.5.1 新增

一个mime类型用来覆盖XHR的mime类型。

password---String类型

用于响应HTTP访问认证请求的密码。

processData---Boolean类型

默认值:true

默认情况下,通过<span id="4_nwp">data</span>属性传递进来的数据,如果是一个对象(技术上讲,只要不是字符串),都会处理转化成一个查询字符串,以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM树信息或其它不希望转换的信息,请设置为false

scriptCharset---String类型

设置该请求加载的脚本文件的字符集。只有当请求时dataType为"jsonp"或"script",并且type是"GET"才会用于强制修改charset。这相当于设置<script>标签的charset属性。通常只在当前页面和远程数据的内容编码不同时使用。</script>

statusCode---Object类型1.5 新增

默认值: {}

一组数值的HTTP代码和函数构成的对象,当响应时调用了相应的代码。例如:

$.ajax({
    url: a_not_found_url ,    
    // 当响应对应的状态码时,执行对应的回调函数    
    statusCode: {        404: function() {
            alert( "找不到页面" );
        },        200: function(){
            alert("请求成功");
        }
    }
});

success---Function/Array类型

指定请求成功后执行的回调函数。该函数有3个参数:请求返回的数据、响应状态字符串、jqXHR对象。

从jQuery 1.5开始,该属性值可以是数组形式的多个函数,每个函数都将被回调执行。

timeout---Number类型

设置请求超时的毫秒值。

traditional---Boolean类型

如果你希望使用传统方式来序列化参数,将该属性设为true

type---String类型

默认值:"GET"。

请求类型,可以为'POST'或'GET'。注意:你也可以在此处使用诸如'PUT'、'DELETE'等其他请求类型,但它们不被所有浏览器支持。

url --- String类型

默认值:当前页面URL。

请求的目标URL。

username --- String类型

用于响应HTTP访问认证请求的用户名。

xhr --- Function类型

默认值:在IE下是ActiveXObject(如果可用),在其他浏览器中是XMLHttpRequest

一个用于创建并返回XMLHttpRequest对象的回调函数。你可以重写该属性以提供自己的XHR实现,或增强其功能。

xhrFieldsObject类型1.5.1 新增

一个具有多个"字段名称-字段值"对的对象,用于对本地XHR对象进行设置。一对「文件名-文件值」在本机设置XHR对象。例如,如果需要,你可以用它来为跨域请求设置XHR对象的withCredentials属性为true

$.ajax({
   url: a_cross_domain_url,   // 将XHR对象的withCredentials设为true   xhrFields: {
      withCredentials: true
   }
});

注意:
1、如果你的所有AJAX请求都需要设置settings中某些参数,你可以使用jQuery.ajaxSetup()函数进行全局设置,而无需在每次执行jQuery.ajax()时分别设置。
2、在jQuery 1.4(含)之前,选项参数completesucceserrorAjax事件的回调函数的第3个参数不是经过jQuery封装的jqXHR对象,而是原生的XMLHttpRequest对象。

返回值

jQuery.<span id="19_nwp">ajax()</span>函数的返回值为jqXHR类型,返回当前该请求的jqHXR对象(jQuery 1.4及以前版本返回的是原生的XMLHttpRequest对象)。

示例&说明

如果没有给jQuery.ajax()指定任何参数,则默认请求当前页面,并且不对返回数据进行处理。

jQuery.ajax()函数的settings对象中,常用的属性有:url、type、async、data、dataType、success、error、complete、beforeSend、timeout等。

请参考下面这段初始HTML代码:

<div id="content"></div>

以下是与jQuery.ajax()函数相关的jQuery示例代码,以演示jQuery.ajax()函数的具体用法:

(演示页面只有第一个ajax()函数,其他代码请自行复制到演示页面分别执行)

$.ajax({
     url: "jquery_ajax.php"
    , type: "POST"
    , data: "name=codeplayer&age=18"
    , success: function( data, textStatus, jqXHR ){
        // data 是返回的数据
        // textStatus 可能为"success"、"notmodified"等
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        alert("返回的数据" + data);
    }
});


$.ajax({
     url: "jquery_ajax.php?page=1&id=3"
    , type: "POST"
    // jQuery会自动将对象数据转换为 "name=codeplayer&age=18&uid=1&uid=2&uid=3"
    , data: { name:"codeplayer", age:18, uid: [1, 2, 3] }
    // 请求成功时执行
    , success: function( data, textStatus, jqXHR ){
        alert("返回的数据" + data);
    }
    // 请求失败时执行
    , error: function(jqXHR, textStatus, errorMsg){
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        // textStatus 可能为: null、"timeout"、"error"、"abort"或"parsererror"
        // errorMsg 可能为: "Not Found"、"Internal Server Error"等
        alert("请求失败:" + errorMsg);
    }
});


// 将url单独提取出来作为第一个参数(jQuery 1.5+才支持)
$.ajax("jquery_ajax.php?action=type&id=3", {
     dataType: "json" // 返回JSON格式的数据
    , success: function( data, textStatus, jqXHR ){
        // 假设返回的字符串数据为{ "name": "CodePlayer", age: 20 }
        // jQuery已帮我们将该JSON字符串转换为对应的JS对象,可以直接使用
        alert( data.name ); // CodePlayer
    }   
});


$.ajax( {
    // 注意这里有个参数callback=?
     url: "http://cross-domain/jquery_ajax.php?name=Jim&callback=?&age=21"
    , async: false // 同步请求,发送请求后浏览器将被锁定,只有等到该请求完成(无论成功或失败)后,用户才能操作,js代码才会继续执行
    , dataType: "jsonp" // 返回JSON格式的数据
    , success: function( data, textStatus, jqXHR ){
        // 假设返回的字符串数据为{ "site_name": "CodePlayer", "site_desc": "专注于编程开发技术分享" }
        // jQuery已帮我们将该JSON字符串转换为对应的JS对象,可以直接使用
        alert( data.site_desc ); // 专注于编程开发技术分享
    }   
});


$.ajax( {
    // 加载指定的js文件到当前文档中
     url: "http://code.jquery.com/jquery-1.8.3.min.js"
    , dataType: "script"
});

推荐学习:《ajax视频教程

以上是ajax函数是什么的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
反应与前端:建立互动体验反应与前端:建立互动体验Apr 11, 2025 am 12:02 AM

React是构建交互式前端体验的首选工具。1)React通过组件化和虚拟DOM简化UI开发。2)组件分为函数组件和类组件,函数组件更简洁,类组件提供更多生命周期方法。3)React的工作原理依赖虚拟DOM和调和算法,提高性能。4)状态管理使用useState或this.state,生命周期方法如componentDidMount用于特定逻辑。5)基本用法包括创建组件和管理状态,高级用法涉及自定义钩子和性能优化。6)常见错误包括状态更新不当和性能问题,调试技巧包括使用ReactDevTools和优

React和前端堆栈:工具和技术React和前端堆栈:工具和技术Apr 10, 2025 am 09:34 AM

React是一个用于构建用户界面的JavaScript库,其核心是组件化和状态管理。1)通过组件化和状态管理简化UI开发。2)工作原理包括调和和渲染,优化可通过React.memo和useMemo实现。3)基本用法是创建并渲染组件,高级用法包括使用Hooks和ContextAPI。4)常见错误如状态更新不当,可使用ReactDevTools调试。5)性能优化包括使用React.memo、虚拟化列表和CodeSplitting,保持代码可读性和可维护性是最佳实践。

React在HTML中的作用:增强用户体验React在HTML中的作用:增强用户体验Apr 09, 2025 am 12:11 AM

React通过JSX与HTML结合,提升用户体验。1)JSX嵌入HTML,使开发更直观。2)虚拟DOM机制优化性能,减少DOM操作。3)组件化管理UI,提高可维护性。4)状态管理和事件处理增强交互性。

REACT组件:在HTML中创建可重复使用的元素REACT组件:在HTML中创建可重复使用的元素Apr 08, 2025 pm 05:53 PM

React组件可以通过函数或类定义,封装UI逻辑并通过props接受输入数据。1)定义组件:使用函数或类,返回React元素。2)渲染组件:React调用render方法或执行函数组件。3)复用组件:通过props传递数据,构建复杂UI。组件的生命周期方法允许在不同阶段执行逻辑,提升开发效率和代码可维护性。

反应严格模式目的反应严格模式目的Apr 02, 2025 pm 05:51 PM

React严格模式是一种开发工具,可通过激活其他检查和警告来突出反应应用中的潜在问题。它有助于识别遗产代码,不安全的生命周期和副作用,鼓励现代反应实践。

反应碎片使用反应碎片使用Apr 02, 2025 pm 05:50 PM

React片段允许将儿童分组而没有额外的DOM节点,增强结构,性能和可访问性。他们支持钥匙以进行有效的列表渲染。

反应和解过程反应和解过程Apr 02, 2025 pm 05:49 PM

本文讨论了React的对帐过程,详细介绍了它如何有效地更新DOM。关键步骤包括触发对帐,创建虚拟DOM,使用扩散算法以及应用最小的DOM更新。它还覆盖了经家

虚拟DOM解释了虚拟DOM解释了Apr 02, 2025 pm 05:49 PM

本文讨论了虚拟DOM,这是Web开发中的关键概念,该概念通过最大程度地减少直接DOM操纵和优化更新来增强性能。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解锁Myrise中的所有内容
3 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

WebStorm Mac版

WebStorm Mac版

好用的JavaScript开发工具

螳螂BT

螳螂BT

Mantis是一个易于部署的基于Web的缺陷跟踪工具,用于帮助产品缺陷跟踪。它需要PHP、MySQL和一个Web服务器。请查看我们的演示和托管服务。

SecLists

SecLists

SecLists是最终安全测试人员的伙伴。它是一个包含各种类型列表的集合,这些列表在安全评估过程中经常使用,都在一个地方。SecLists通过方便地提供安全测试人员可能需要的所有列表,帮助提高安全测试的效率和生产力。列表类型包括用户名、密码、URL、模糊测试有效载荷、敏感数据模式、Web shell等等。测试人员只需将此存储库拉到新的测试机上,他就可以访问到所需的每种类型的列表。

VSCode Windows 64位 下载

VSCode Windows 64位 下载

微软推出的免费、功能强大的一款IDE编辑器

Atom编辑器mac版下载

Atom编辑器mac版下载

最流行的的开源编辑器