为什么要封装ajax,因为……for(var i=0;i<20;i++){ $.ajax(……)}的时候,整个页面都卡死了,于是,我开始找答案。后来,找到了,就是jquery的ajax属于全局,当上文不执行完毕,其他的都动不了。于是乎有了封装ajax,将ajax作为局部使用,即可解决掉。 function ajax(options) {options = options || {};options.type = (options.type || "GET").toUpperCase();options.dataType = options.dataType || "json";v...
// ajax发送post请求返回 json 数据function requestJSON(params) { params.dataType = ‘json‘; sendPost(params);}// ajax发送post请求返回 string字符串function requestString(params) { params.dataType = ‘text‘; sendPost(params);}// ajax发送post请求function sendPost(params) { params.type = ‘post‘; sendRequest(params);}// ajax发送get请求function request(params) { params.type = ‘g...
首先我们先了解ajax的get和post请求分别是怎样请求数据的get请求 let ajx = new XMLHttpRequest() //创建ajax实例/*打开需要请求的地址,可以有三个参数参1:请求方式参2:请求地址参3:是否异步,可选,默认异步*/ajx.open(‘get‘,‘http://localhost/day02/api/gouwu.php?name=zhangsan‘)ajx.send()//向后端发送的数据,get方式用不到ajx.onreadystatechange = ()=>{//监听状态if(ajx.readyState==4){//判断就绪码,4为...
1//eg: 2// var data ={ 3// id: id, 4// typeName: mame, 5// getcCity:city 6// } 7//2.url:需要传到后台的url 8//3.callback :回调函数 9//+++++++++++++++++++++++Demo:+++++++++++++++++++++++++++++++++++10//var data ={11// id: id,12// typeName: name13//}14//var url = encodeURI("${pageContext.request.contextPath}/ajax/certificate/saveCertificateType");15//actionRequest(data,url,...
为了避免ajax漫天飞,我们需要对jQuery的代码进行封装,封装代码:function api_request(name, params, cb, scope, async, el) {if (async == null)async = true;console.log(‘调用接口:\n%s,\n参数列表:‘, REQUEST_URL+name, params);$.ajax( {url : REQUEST_URL+name,async : async,data : params,type : ‘POST‘,dataType:‘json‘,cache : false,timeout:70000,success : function(data, textStatus) {//alert(data.obj[0]....
function sendAjax({type="get",url="",data=null,dataType="json"}) {// 该函数的作用就是返回一个改变了状态的(成功或失败)的promise实例对象return new Promise((reslove, reject) => {$.ajax({type,url,data,dataType,success: function (response) {reslove(response)},error(err) {reject(err)}});})}// 函数的调用:
sendAjax({url:"http://cj.shenzhou888.com.cn/hb_vote/api.php?action=area&id=0"})
.then((data) => {...
async/await 1)async/await场景 这是一个用同步的思维来解决异步问题的方案,当前端接口调用需要等到接口返回值以后渲染页面时。 2)名词解释 >async async的用法,它作为一个关键字放到函数前面,用于表示函数是一个异步函数,因为async就是异步的意思, 异步函数也就意味着该函数的执行不会阻塞后面代码的执行, async 函数返回的是一个promise 对象。 >await await的含义为等待...
不啰嗦了,咱们直接来精髓!!!没有对其代码的步骤进行详细的解释/* *使用ajax获取数据时,可以使用此js* url: 请求地址* fnSucc:获取响应数据函数* fnFaild:显示失败信息请求函数* str: 直接响应的字符串数据*//*
//响应数据使用模板
ajaxRquest("http://localhost:8080/ajax/user.xml",function (str) {var div1=document.getElementById("div1");div1.innerHTML=str;},function () {alert("失败了!");})*/function ajaxRques...
AJAX说起来感觉很难,但是把他封装起来你会发现使用起来很简单了,当然也是简单的应用了,譬如留言板的应用等,这里首先,先送大家一个礼物那就是封装好的AJAX的类,下载地址http://xiazai.jb51.net/201412/yuanma/ajax3.0(jb51.net).rar 这里下载这个类,然后教大家怎么使用吧!
实例哦!复制代码 代码如下:
<html>
<head>
<title>Ajax实例</title>
<script src="ajax3.0.js"></script>
</head>
<body>
<script>
doc...
我的前端工具集(六)Ajax封装token liuyuhang原创,未经允许禁止转载 在单点登陆中,或登陆验证后,不应该每次都验证用户名和密码,也不应该将用户名密码存入cookie中(虽然很多都这么做) token作为一种验证策略,实现起来比较简单,也可以找一些单点登陆的框架,或者token解决方案。 本文工具使用REST风格,将ajax经过简单封装,使得所有使用此封装后的ajax都默认进行token验证。 1、封装的ajax代码 /*** 封装ajax代码*/var loc...
/*** ITCAST WEB* Created by lsy on 2016/5/24.*//** 1. 请求的类型 type get post* 2. 请求地址 url* 3. 是异步的还是同步的 async false true* 4. 请求内容的格式 contentType* 5. 传输的数据 data json对象** 6.响应成功处理函数 success function* 7.响应失败的处理函数 error function** 这些都是动态参数 参数对象 o...
最近在完成公司项目,技术栈为vue2.0+vux+vuex+webpack+echarts...另外还有vue-router及vue-loader(webpack下loader插件 可以把.vue文件 输出成组件).考虑将ajax封装,目的有两个:1、页面内写法简单,格式和国网平台格式一致,后期无需再更改代码2、复用性3、域名,端口等信息可以实现统一管理。首先,先在components模块内定义自己的ajax,此处使用install方法,目的是可以在main.js中使用vue.use()方法将其注入vue实例中,具体代...
在前端异步获取数据时候每次都是使用 ajax;为了通用性更好,然而封装通用的 ajax 是一个一劳永逸的办法。
本次基于 jQuery 封装实现;
第一步: 引入 jQuery:<script type="text/javascript" src="<%=path%>/resources/js/jquery.min.js"></script>第二步:实现代码:// 该封装基于 jQueryvar sendAjax = function(method, url, data, successfn, errorfn) {$.ajax({type: method,url: url,data: data,success: function(d){succ...
虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯;2,可以对ajax操作做一些统一处理,比如追加随机数或其它参数。同时在工作中,我们还会发现,有一些ajax请求的数据,对实时性要求不高,即使我们把第一次请求到的这些数据缓存起来,然后当相同请求再次发起时直接拿之前缓存的数据返回也不会对相关功能有影响,通过这种手工的缓存控制,减少...
虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯;2,可以对ajax操作做一些统一处理,比如追加随机数或其它参数。同时在工作中,我们还会发现,有一些ajax请求的数据,对实时性要求不高,即使我们把第一次请求到的这些数据缓存起来,然后当相同请求再次发起时直接拿之前缓存的数据返回也不会对相关功能有影响,通过这种手工的缓存控制,减少...