再次封装ajax函数，统一入口

根据API写网页的时候,每个页面都需要ajax请求,每次都写一大堆请求,配置什么的太麻烦,于是打算封装一个ajax函数,统一调用: 开始时是使用return返回ajax,如下: function createAjax(ajaxrequire) { _url = ajaxrequire._urls; _dataType = ajaxrequire._dataType; _async = ajaxrequire._async _method = ajaxrequire._method; _data…

轻松搞定Ajax（分享下自己封装ajax函数，其实Ajax使用很简单，难是难在你得到数据后来怎样去使用这些数据）

hey,guys!今天我们一起讨论下ajax吧!此文只适合有一定ajax基础,但还是模糊状态的同志,当然高手也可以略过~~~ 一.概念 Ajax(Asynchronous Javascript + XML(异步JavaScript和XML )) 二.效果实现无刷新效果,向后台异步的取数据(不是只有AJAX才能实现这样的效果的哦,如img , script标签中的src属性也可以实现一样的效果,可以自己尝试一下哦) 三.本质可能我们在学习过程中会觉得ajax好难,我也是这样过来的,我觉得是我们…

使用promise手动封装ajax函数

最近在做一个单页应用,node和浏览器仅通过json传输数据,因为是只有自己用等于是锻炼一下自己,所以也不用考虑seo的问题,node端我已经写好了,但是浏览器端想要用ajax原生太麻烦,用封装的函数又需要引入angular,jquery等大型框架.我写node比较多,觉得用什么功能就引入什么功能,不太喜欢用大而全的框架,所以只好手动封装一下ajax的操作 ajax的xhr对象有7个事件 onloadstart 开始send触发 onprogress …

封装ajax函数

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script src="new_ajax.js"></script> <script> window.onload=function () { var oBtn=document.getElementById('…

使用jquery再次封装ajax

$.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/…

04.封装ajax

原生JS封装ajax方法

http://blog.sucaijiayuan.com/article/89 jquery框架的ajax方法固然好用,但是假如某天我们的项目不能引入jquery或项目需求很简单,没有很多交互功能,只需要ajax,这时引入jquery库会造成资源浪费,也会显得页面臃肿.这时我们就需要用原生JS写一个ajax函数了. /* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请…

自封装ajax

项目中有时候用不到jq,需要了解xmlhttp原理,自己写一套函数请求和发送数据! /* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的 * @param {object}opt.data 发送的参数,格式为对象类型 * @param {functi…

ajax 原生js封装ajax [转]

/* 封装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的再次封装！(改进版) —— new与不 new 有啥区别？

生命不息重构不止! 上一篇写了一下我对ajax的再次封装的方法,收到了很多有价值的回复,比如有童鞋建议用$.extend,一开始还以为要做成插件呢,后来才知道,原来这个东东还可以实现合并.省着自己再去做判断了. 还有童鞋说“要不要多加点传入参数”,这一下提醒我了,ajax有很多参数呀,常用的我考虑进来了,但是还有很多不常用的呢,如果需要的话怎么办?在看看我调用原生ajax的方式,kao,完全不支持增加其他参数吗,这怎么行,改一定要改.于是就改成了这样. //对ajax的封装 //最基础的一层封装…

ajax的再次封装！

js的动态加载.缓存.更新以及复用系列有点卡文,放心会继续的.先来点更基础的,为js的加载做点铺垫. jQuery的ajax本来就很方便了,为啥还要在进一步的封装呢?这个首先要看项目的具体需求了,如果觉得不需要,那么完全可以直接用jQuery提供的各种ajax的方法.如果像我似地,感觉不太方便的话,那么完全可以按照自己的想法和需求来再次封装一下. 需求: 1.调用的时候更加的简单. 2.可以灵活的做各种设置和变化. 3.可以满足一些通用的需求.比如出错的时候给出提示. 项目现状: 做ajax请…

AJAX编程-封装ajax工具函数

即 Asynchronous [e'sɪŋkrənəs] Javascript And XML,AJAX 不是一门的新的语言,而是对现有技术的综合利用.本质是在HTTP协议的基础上以异步的方式与服务器进行通信. XMLHttpRequest可以以异步方式的处理程序,浏览器内建对象,用于在后台与服务器通信(交换数据) ,由此我们便可实现对网页的部分更新,而不是刷新整个页面. 封装ajax工具函数 $.ajax = function(options){ if(!options) return fal…

JavaScript封装Ajax工具函数及jQuery中的ajax，xhr在IE的兼容

封装ajax工具函数首先要思考:1.为什么要封装它?提高开发效率2.把一些不确定的情况考虑在其中 a. 请求方式 b. 请求地址 c. 是否异步 d. 发送参数 e. 成功处理 f. 失败处理3.确定参数 a. Type--请求方式 get (get/post) b. Url--请求地址默认当前地址字符串 c. Async--是否异步 true (true/false) d. Data--发送的数据 {} 对象{name:xx} e. Success--成功回调 function 函数函…

Ajax入门（二）Ajax函数封装

如果看了的我上一篇博客<Ajax入门(一)从0开始到一次成功的GET请求>的话,肯定知道我们已经完成了一个简单的get请求函数了.如下: 123456789101112131415161718192021222324252627282930313233343536373839404142 /** * 一个简单的get请求 * @param {String} url 请求地址,文件名 * @param {Function} fnSucc 请求成功时执行的函数 * @param {Function…

js进阶ajax函数封装（匿名函数作为参数传递）（封装函数引入文件的方式非常好用）

js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用) 一.总结 2.匿名函数作为参数传递二.js进阶ajax函数封装 ajax1.js function ajax(url,funSucc,fnFaild){ //1.以函数作为函数的参数传进来 var xhr=new XMLHttpRequest(); xhr.open('GET',url,true); xhr.send(null); xhr.onreadystatechange=function(){ if (x…

原生ajax解析&封装原生ajax函数

前沿:对于此篇随笔,完是简要写了几个重要的地方,具体实现细节完在提供的源码做了笔记 <一>ajax基本要点介绍--更好的介绍ajax 1. ajax对象中new XMLHttpRequest()属性和方法列表 2. 常用事件介绍事件触发时机 onreadystatechange 当readyState的值改变时触发,除了当它从非0变成0时 onloadstart 当调用send方法时会触发xhr.onloadstart,然后会触发xhr.upload.onloadstart,代表开始上传数…

rxjs入门3之项目中ajax函数封装

项目中ajax函数封装⽹页应⽤主要数据源有两个:⼀个是⽹页中的DOM事件,另⼀个就是通过AJAX获得的服务器资源.我们已经知道fromEvent这个操作符可以根据DOM事件产⽣Observable对象,相应的,RxJS还提供了另⼀个名为ajax的操作符,根据AJAX请求的返回结果产⽣Observable对象,当处理复杂的逻辑时,通过操作符组合实现数据流处理才能彰显威⼒,现在接触的还是创建类操作符,当接触到其他类型的操作符之后,会看到ajax的巧妙⽤法. 注释:下代码为react项目中ajax进…

Ajax函数的封装

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); // 获取服务器端响应到客户端…

原生ajax函数封装

原生ajax函数 function ajax(json){ json=json || {}; if(!json.url){ return; } json.data=json.data || {}; json.type=json.type || 'get'; var xmlhttp = null; if(window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); }else{ xmlhttp=new ActiveXObject('Microsoft.…

前后端交互之封装Ajax+SpringMVC源码分析

为什么需要封装呢?因为用的多,我想将其封装成函数,当我想用它时,只需将那个函数对应的js文件引入即可,而不要重复写很多相同代码,利于开发效率的提高. 无论是$.ajax或$.post.$.get等,在开发中是经常用到的.再比如一些前端框架,例如easyui.ext.js等,ajax也是封装的. 编程的世界,封装无处不在. 具体js代码如下: /** * 增删改通用ajax请求 * @param type * @param url * @param datatype * @param conten…

Ajax作用、及Ajax函数的编写

关于Ajax 指的是异步 (Asynchronous JavaScript and XML) <异步的javascript和XML> 1. Ajax并非缩写词,而是由Jesse James Gaiiett创造的名词,是指一种创建交互式网页应用的网页开发技术 2. Ajax并不是最新的编程语言,而是一种使用现有标准的新方法它用于创建更好更快以及交互性更强的 Web 应用程序的技术. 3. Ajax是能在不重新加载整个页面<无需刷新!>的情况下,能与服务器交换数据并更新网页内部分内…

easyui的window插件再次封装

easyui的window插件再次封装说明:该插件弹出的弹出框在最顶层的页面中,而不是在当前页面所在的iframe中,它的可拖动范围是整个浏览器窗口:所以不能用JS的parent对象获取弹出它的父页面,这里用了一个笨方法,最多支持四级弹出框,即弹出框中再弹出弹出框的情况,笨方法也是方法,它很简单.很有效. 代码: /** * easyui的window插件再次封装 * 2014年11月10日 */ SimpoWin = { showWin: function showWindow(title,…

使用原生JS封装Ajax

使用原生的JS封装 Ajax,实现仿JQuery的Ajax,post,get三种异步请求方式: var MAjax = { //根据浏览器创建异步对象 createXhr: function () { //经测试:IE7.0及以上版本的IE,两种异步创建的两种方式都支持 //如果XMLHttpRequest存在,则是IE7.0及其它内核,则直接创建异步对象(!==非全等于, === 全等于) if (typeof XMLHttpRequest !== 'undefined') { //相当!…

原生javascript封装ajax和jsonp

在我们请求数据时,完成页面跨域,利用原生JS封装的ajax和jsonp: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script> //ajax 和jsonp 跨域的封装 var $={ //封装a…

jQuery.ajax() 函数详解

jQuery.ajax()函数用于通过后台HTTP请求加载远程数据. jQuery.ajax()函数是jQuery封装的AJAX技术实现,通过该函数,我们无需刷新当前页面即可获取远程服务器上的数据. jQuery.ajax()函数是jQuery的底层AJAX实现.jQuery.get(). jQuery.post(). load(). jQuery.getJSON(). jQuery.getScript()等函数都是该函数的简化形式(都调用该函数,只是参数设置有所不同或有所省略). 该函数属于全…

详细解读Jquery各Ajax函数

$.get(),$.post(),$.ajax(),$.getJSON() 一,$.get(url,[data],[callback]) 说明:url为请求地址,data为请求数据的列表,callback为请求成功后的回调函数,该函数接受两个参数,第一个为服务器返回的数据,第二个参数为服务器的状态,是可选参数. 而其中,服务器返回数据的格式其实是字符串形势,并不是我们想要的json数据格式,在此引用只是为了对比说明 $.get("data.php",$("#firstName…

javascript笔记——jqGrid再次封装

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…