ajax的再次封装!】的更多相关文章

生命不息重构不止! 上一篇写了一下我对ajax的再次封装的方法,收到了很多有价值的回复,比如有童鞋建议用$.extend,一开始还以为要做成插件呢,后来才知道,原来这个东东还可以实现合并.省着自己再去做判断了. 还有童鞋说“要不要多加点传入参数”,这一下提醒我了,ajax有很多参数呀,常用的我考虑进来了,但是还有很多不常用的呢,如果需要的话怎么办?在看看我调用原生ajax的方式,kao,完全不支持增加其他参数吗,这怎么行,改一定要改.于是就改成了这样. //对ajax的封装 //最基础的一层封装…
js的动态加载.缓存.更新以及复用 系列有点卡文,放心会继续的.先来点更基础的,为js的加载做点铺垫. jQuery的ajax本来就很方便了,为啥还要在进一步的封装呢?这个首先要看项目的具体需求了,如果觉得不需要,那么完全可以直接用jQuery提供的各种ajax的方法.如果像我似地,感觉不太方便的话,那么完全可以按照自己的想法和需求来再次封装一下. 需求: 1.调用的时候更加的简单. 2.可以灵活的做各种设置和变化. 3.可以满足一些通用的需求.比如出错的时候给出提示. 项目现状: 做ajax请…
1.封装的ajax var funUrl=""   // 每个请求地址相同的部分 function queryData(url,params,success,error){ url=funUrl+url;// 拼接请求地址 var success = arguments[2]?arguments[2]:function(){};// 成功执行的函数 var error = arguments[3]?arguments[3]:function(){};// 失败执行的函数 $.ajax(…
zDialog插件网址:http://www.jq22.com/jquery-info2426 再次封装zDialog的代码: (function ($) { $.extend({ iDialog: function (param) { var diag = new Dialog(); if (!param.height && !param.width) { diag.Width = $(top.window).width(); diag.Height = $(top.window).he…
easyui的window插件再次封装 说明:该插件弹出的弹出框在最顶层的页面中,而不是在当前页面所在的iframe中,它的可拖动范围是整个浏览器窗口:所以不能用JS的parent对象获取弹出它的父页面,这里用了一个笨方法,最多支持四级弹出框,即弹出框中再弹出弹出框的情况,笨方法也是方法,它很简单.很有效. 代码: /** * easyui的window插件再次封装 * 2014年11月10日 */ SimpoWin = { showWin: function showWindow(title,…
今天接着我们上篇博文的栗子,现在我来扩大一下需求,之前是点击按钮取出新闻,现在要实现每隔一段事件进行新闻的更新.这个时候,肯定是加一个定时器,然后每隔一段事件,再进行一次Ajax请求,既然要经常用到Ajax请求,封装函数就很必要了,先来看一下上个栗子的js代码,我们来进行封装. window.onload = function() { var oBtn = document.getElementById('btn'); oBtn.onclick = function() { var xhr =…
xingrunzhao js插件再次封装 demo 'use strict'; /** * commerce grid框架 * 依赖jqgrid */ (function ($_self, jQuery) { //jQuery.ajaxSetup({cache: false}); var _this = $_self; /** * 底层核心列表 * @param grid_selector gird选择器 * @param pager_selector 分页器选择器 * @param loadU…
jQuery Ajax通用js封装 第一步:引入jQuery库 <script type="text/javascript" src="<%=path%>/resources/js/jquery.min.js"></script> 第二步:开发Ajax封装类,已测试通过,可以直接调用,直接贴代码,讲解就省了 /*************************************************************…
ajax二次封装之异步加载 ajax异步加载会导致在数据未加载回来就读取数据,然后出现数据为空的报错.在ajax封装时,将ajax直接改为同步,虽然可以解决报错,但是会导致页面渲染被阻塞,接口反应时间较长后,会极大的影响用户体验. 在做一个展示系统的时候,数据库数据较多,页面报表调用接口较多,倒是页面刷新后需要4-5s去加载,所以将ajax封装的方法做了回调. 框架(vue) 在项目中封装了一个全局方法:ajaxData.js exports.install = function (Vue, o…
微信小程序request(ajax)接口请求封装 最近在进行小程序的编写,需要调用后端接口,经常要用到wx.request方法,所以就自己封装了一下,简化一下代码,如果能给大家提供帮助更好,在封装的时候我在网上看了很多篇博客,90%以上的全都是直接在success回调函数中直接打印返回值console.log(res.data)这个当然是没有问题的,但是我们都知道微信小程序的数据是实现数据绑定的,这一点和Vue框架很像,而在Vue框架的JS文件中我们可以通过 function loginSucc…
为方便程序对redis操作,我对poco的redis进行了再次封装,主要是针对自己应用需要的部分. 开发工具:netbean 系统环境:centos7 poco版本: poco-1.9.0-all 其实只用了redis中的list 头文件: #include <Poco/Redis/Exception.h>#include <Poco/Redis/Client.h>#include <Poco/Redis/Command.h>#include <Poco/Redi…
Ajax函数的封装 function ajax(options) { // 1 创建Ajax对象 let xhr = new XMLHttpRequest(); // 2 告诉Ajax对象要想哪儿发送请求,以什么方式发送请求 // 1)请求方式2)请求地址 xhr.open('get', 'http://localhost:3003/basicUseOfAjaxTest'); // 发送请求 xhr.send(options.type, options.url); // 获取服务器端响应到客户端…
根据API写网页的时候,每个页面都需要ajax请求,每次都写一大堆请求,配置什么的太麻烦,于是打算封装一个ajax函数,统一调用: 开始时是使用return返回ajax,如下: function createAjax(ajaxrequire) { _url = ajaxrequire._urls; _dataType = ajaxrequire._dataType; _async = ajaxrequire._async _method = ajaxrequire._method; _data…
1.封装成一个独立JS var commonUrl = 'http://xx.xxx.com/'; function http({ url, type = "post", dataType = "json", data = {}, success }) { $.ajax({ url: commonUrl + url, type, dataType, data, success: function (res) { success(res); } }) } 2.调用 v…
$.fn.ajaxSend = function (type, url, postdata, onSuccess) { $.ajax({ async: false, url: url, type: type, data: postdata == null|| postdata == "" ? "" : postdata, datatype: "json", cache: false, contentType: "application/…
前端的工作,免不了要用到交互,请求后端的数据,可能大多人一直选择用jq封装好的方法直接使用,要知道封装这个事我们自己也可以的,今天给大家介绍一种封装方法,而且连跨域问题都不在话下,有了这个函数,是不是ajax请求so easy了呢!!下面就是: function ajax(obj){//做网络请求的时候,参数以对象的形式传递进来,用的之后直接传参就ok啦! //规定:obj里面包含属性 //1.url //2.type-----get还是post                         …
第一步:引入jQuery库 <script type="text/javascript" src="<%=path%>/resources/js/jquery.min.js"></script> 第二步:开发Ajax封装类,已测试通过,可以直接调用,直接贴代码,讲解就省了 /***************************************************************** jQuery Ajax封装…
首先,要实现如下图效果, 1.要理清思路: 先做出三个下拉菜单----根据第一个下拉菜单的value值获取第二个下拉列表的内容,第三个同理. 2.用到的数据库表:Chinastates表 规律:根据国家级(中国)的areacode查询省级(如:北京) ; 根据省级的areacode查询市级(如:北京市辖):根据市级的areacode查询区级(如东城区) 第一种方式:没有用到封装,数据读取较慢,可以看看原理,这样在第二种方式封装时就容易多了. 代码如下: <!DOCTYPE html> <…
Ajax大家每天都在用,jquery库对Ajax的封装也很完善.很好用,下面我们看一下他的内部原理,并手动封装一个自己的Ajax库. 更多有关ajax封装及数据处理,请参看上海尚学堂<Ajax中replace+Jq封装的ajax>.<ajax+json数据处理> 一.原理 原生Ajax的发送需要四步:1) 创建Ajax对象: XMLHttpRequest 2) 设置请求参数: open(请求参数[get/post],url地址, 是否异步[true/false] ) 3) 设置回调…
ajax简单介绍 没有AJAX会怎么样?普通的ASP.Net每次运行服务端方法的时候都要刷新当前页面. 假设没有AJAX,在youku看视频的过程中假设点击了"顶.踩".评论.评论翻页,页面就会刷新,视频就会被打断.开发一个看效果:用<video src="diaosi.mp4" autoplay controls></video>播放视频(仅仅有支持html5的浏览器能播放).然后放一个"赞"button的功能(赞的数量…
为了避免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 : param…
一.Ajax的实现主要分为四部分: 1.创建Ajax对象 // 创建ajax对象 var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); } else { //为了兼容IE6 xhr = new ActiveXObject('Microsoft.XMLHTTP'); } 2.连接服务器 // 连接服务器open(方法GET/POST,请求地址, 异步传输) xhr.open('GET', 'data.txt',…
适用于对老项目维护时,用习惯的axios不能使用的情况 基础封装: 保留 then 的回调.baseHref.method 传 post || get || etc, function ajax(obj) { var callback = $.ajax({ url: window.baseHref + obj.url, type: obj.method || "post", data: obj.data, dataType: 'json', beforeSend: function(r…
导读:AJAX利用一个构建到所有现代浏览器内部的对象-XMLHttpRequest-来实现发送和接收HTTP请求与响应信息.那么,XMLHttpRequest对象是怎么创建和封装的呢? 一.简介 1.1,用途 该对象向服务器发送请求,并接收服务器响应,实现与服务器的异步通信 1.2,发展 在1999年上半年,微软利用ActiveX对象实现了XMLHTTP对象,随后,在2000年,Mozilla实现了相同接口的原生对象XMLHttpRequest对象,Opera,Safari也相继实现. 二.XM…
原生ajax配置详解 // 原生ajax // 1. 创建ajax对象 if(window.XMLHttpRequest){ // // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 var xhr = new XMLHttpRequest() }else{ // IE6, IE5 浏览器执行代码 var xhr = new ActiveXObject("Microsoft.XMLHTTP") } // 2.连接服务器 open(方法,地址,…
/* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的 * @param {object}opt.data 发送的参数,格式为对象类型 * @param {function}opt.success ajax发送并接收成功调用的回调函数 */    fu…
一:AJAX 简介 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新. AJAX = 异步 JavaScript 和 XML. 二:AJAX的使用      1.创建ajax对象: const xhr = new XMLHttpRequest():// IE9及以上                                const xhr = new ActiveXObject('Mricosof…
不带注释的 function ajax(json) { json.type = json.type ? json.type : 'get'; json.async = json.async == false ? false : true; json.contentType = json.contentType ? json.contentType : 'application/x-www-form-urlencoded'; json.data = json.data ? json.data :…
欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 更多资料可参考Ajax 介绍篇丨慕课网教程 (imooc.com) 下面这些都是一些学习笔记.临渊羡鱼,不如退而结网!!愿我自己学有所成,也愿每个前端爱好者学有所成 一. Ajax概述 在网站中存在以下问题: 网速慢的情况下,页面加载时间长,用户只能等待 表单提交后,如果一项内容不合格,需要重新填写所有表单内容 页面跳转,重新…
/** * 跨域提交公用方法 * @param param 参数 * @param url 跨域的地址 * @param callFun 回调函数 callFun(data) */ function jsonpCall(param, url, callFun) { $.ajax({ async:false, type:"GET", url:url, dataType:"jsonp", jsonp:"callback", data:$.param(…