当前位置:首页>开发>正文

jquery封装的ajax怎么使用 原生JS怎么异步请求实现Ajax

2023-05-15 20:11:18 互联网 未知 开发

 jquery封装的ajax怎么使用 原生JS怎么异步请求实现Ajax

jquery封装的ajax怎么使用

s = {type : POST,
url : xxx,
data : {},
async : true,
success : function(result) {
alert(1111)
},
Callback:function(){
alert(2222)
}
}

var _ajax = $.ajax
$.ajax = function (s) {
var old = s.success
s.success = function (data, textStatus, jqXHR) {
alert(333)
if (data && data.IsLogout) {
eval(data.Callback)
}
if (old) {
old(data, textStatus, jqXHR)
}
}
_ajax(s)
}

$.ajax(s)开始,跳进你自定义的$.ajax = fuc/.....
var old = s.success
将 function(result) {
alert(1111)
}
赋值给 old。这是为了保存之前定义的success
s.success = function (data, textStatus, jqXHR) {
alert(333)
if (data && data.IsLogout) {
eval(data.Callback)
}
if (old) {
old(data, textStatus, jqXHR)
}
}
自己封装一个方法。并修改参数s的success,让ajax执行完成之后执行这个方法而不是之前的alert(111)

_ajax(s)执行原生的ajax跳到指定的页面。

成功后跳到 s.success = function (data, textStatus, jqXHR) {
alert(3333)
if (data && data.IsLogout) {
eval(data.Callback)
}
if (old) {
old(data, textStatus, jqXHR)
}
}

最后会依次弹出 3333 2222 1111

原生JS怎么异步请求实现Ajax

来来来 现场给你封一个ajax
function ajaxGet(url){
var xhr=new XMLHttpRequest()
xhr.open(GET,url)
xhr.send()
var promise=new Promise(function(resolved,rejected){
xhr.onload=function(){
if(xhr.status===200){
resolved(xhr.response)
}else{
rejected("请求失败,错误码为:" xhr.status)
}
}
})
return promise
}

如何使用原生js实现ajax请求

var url = "${ctx}/sceneView/dataSetPeriod?sceneId=" $("#sceneId").val() "&dataSetPeriod=" $("#dataSetPeriodIdSelect").val() //要访问的url地址,?后面的是要带回去的参数
$.ajax({
type : "POST", //设置提交方式 get 或post
url : url, //就是上面的url
dataType : "json", //提交的数据类型
success : function(msg){

//这个success方法中是你的java类返回的可以用msg点出来,如果要什么提示信息可以在这里设置

}
})

js面向对象封装ajax

1. 在js中, function也是对象.
2. net也是对象
var net = new Object() //声明一个object对象
//alert(typeof net) //object
net.AjaxRequest = function(){} //声明一个function对象
//alert(typeof net.AjaxRequest) //function3. 在这里this指的是net.AjaxRequest


4. net.AjaxRequest.onReadyState 不加prototype是因为在22行要通过 "对象.方法" 的方式直接调用




你问的这几个问题,研究起来会有点深.. 相关连接我放到评论里.