网创优客建站品牌官网
为成都网站建设公司企业提供高品质网站建设
热线:028-86922220
成都专业网站建设公司

定制建站费用3500元

符合中小企业对网站设计、功能常规化式的企业展示型网站建设

成都品牌网站建设

品牌网站建设费用6000元

本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...

成都商城网站建设

商城网站建设费用8000元

商城网站建设因基本功能的需求不同费用上面也有很大的差别...

成都微信网站建设

手机微信网站建站3000元

手机微信网站开发、微信官网、微信商城网站...

建站知识

当前位置:首页 > 建站知识

jQuery中的AJAX工具函数怎么用

本文小编为大家详细介绍“jQuery中的AJAX工具函数怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“jQuery中的AJAX工具函数怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

让客户满意是我们工作的目标,不断超越客户的期望值来自于我们对这个行业的热爱。我们立志把好的技术通过有效、简单的方式提供给客户,将通过不懈努力成为客户在信息化领域值得信任、有价值的长期合作伙伴,公司提供的服务项目有:空间域名、网站空间、营销软件、网站建设、麻阳网站维护、网站推广。

AJAX工具函数

为什么需要AJAX工具函数:

之前每次发判断请求,如果请求方式,或者参数或者url不一样,那么代码无法复用,所以我们迫切的需要一个通用函数,让用户在使用异步对象的时候通过调用一个相同的函数就可以实现需求总之:为了提升我们的开发效率,我们自已将XMLHttpRequest封装成一个函数。

关键点:

找到操作的共同点找到不同的部分--参数

不同部分:

请求方式:type请求url:url请求参数不一样:data数据的转换方式--返回数据的格式:dataType对于数据的处理方式不一样: success: 这是一个回调函数

函数的封装形式:

var?$?=?{

ajax:function(option){

//?实现具体的业务处理

}

}

代码实现:

var?$?=?{

//传入对象

ajax:function(option){

//?实现具体的业务处理

var?xhr?=?new?XMLHttpRequest()

//?接收参数

var?type=?option.type?||?'get'

//?location.pathname:当前页面的全路径

var?url?=?option.url?||?location.pathname

var?data?=?option.data?||?''

var?dataType?=?option.dataType?||?'text/html'

var?success?=?option.success

//?发送请求

//?设置请求行:get如果有参数就需要拼接在url后面,post不用拼接

if(type?==?'get'){

url?=?url?+?"?"?+?data

data?=?null

}

xhr.open(type,url)

//?设置请求头:get方式不需要设置请求头,post方式需要设置Content-Type

if(type?==?'post'){

xhr.setRequestHeader('Content-Type','application/x-')

}

//?设置请求体:如果有参数,post方式在请求体中传递参数

xhr.send(data)

//?接收响应

xhr.onload?=?function(){

//?调用回调

success?&&?success(this.response)

}

}

}

由以上封装的函数,可以看出在客户端每次发判断请求: 不同方式的请求,不同参数,不同url,只要用以上的函数传入所需的参数即可得到结果,做到了代码的复用,使代码更简洁。提升了开发效率。

读到这里,这篇“jQuery中的AJAX工具函数怎么用”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注创新互联行业资讯频道。


分享题目:jQuery中的AJAX工具函数怎么用
当前路径:http://bjjierui.cn/article/pdpcso.html

其他资讯