js ajax 函数

<script>

    var ajax = (function() {

 

        var parseParam = function(origin , target) {

            origin = origin || {};

            target = target || {};

            var obj = {};

            for(var key in origin) {

                if(target[key]) {

                    obj[key] = target[key];

                } else {

                    obj[key] = origin[key];

                }

            }

            return obj;

        };

 

        var getXhr = function() {

           var _xhr = false;

           try {

               _xhr = new XMLHttpRequest();

           } catch(ms) {

               try {

                   _xhr = new ActiveXObject("Msxml2.XMLHTTP");

               } catch(otherms) {

                   try {

                      _xhr = new ActiveXObject("MICROSOFT.XMLHTTP");    

                   } catch(failed) {

 

                   }

               }

           }

           return _xhr;         

        };

 

        var jsonToQuery = function(jsonObj) {

            var result = [];

            for(var key in jsonObj) {

                result.push(key + "=" + jsonObj[key]);

            }

            return result.join('&');

        };

 

        /*

         *      {

         *          url :

         *          args : 

         *          method : 

         *          complete : 

         *      } 

         */

        var funcEmpty = function() {};

        return function(opts) {

 

            opts = parseParam({

                type : "json",

                url : "",

                args : {},

                method : "get",

                complete : funcEmpty                

            } , opts);

 

            console.log(opts.url);

 

            var xhr = getXhr();

 

            var url = opts.url;

 

            var query = jsonToQuery(opts.args);

 

            var cback = function() {

 

                if(xhr.readyState === 4) {

                    if(opts.type === 'json') {

                        var obj = eval('(' + xhr.responseText + ')');

                        opts.complete(obj);

                    } else {

                        var result = xhr.responseXML;

                        opts.complete(result);

                    }

                }

            };

 

            xhr.onreadystatechange = cback;

 

 

            var setHeader = function() {

                try {

                    xhr.setRequestHeader('Content-Type' , 'application/x-www-form-urlencoded');

                    xhr.setRequestHeader('X-Requested-With' , 'XMLHttpRequest');

                } catch(e){

 

                }

            };

 

            if(opts.method === 'get') {

                url = url + (url.indexOf('?') == -1 ? '?' : "&") + query;

                xhr.open("get" , url , true);

                setHeader();

                xhr.send(null); 

            } else {

                xhr.open("post" , url , true);

                setHeader();

                xhr.send(query);

            }

        };

    })();

 

 

    ajax({

       url : "/php/test/ajax.php",

       method : "post",

       args : {

           a : 1,

           b : 2,

           c : 3

       },

       complete : function(json) {

          console.log(json);

       }

    });

 

 

</script>

jsajax函数,原生JS写的ajax函数 参照JQuery中的ajax功能,用原生JS写了一个ajax,功能相对JQuery要少很多,不过基本功能都有,包括JSONP。调用的方式分为两种:1. ajax(url, {});2. ajax({});调用的方法参照JQuery的ajax,只是 不需要写$.ajax ,只需要写 ajax 就可以了。代码如下:!function () {var jsonp_idx = 1;return ajax ... 阅读详情

相关推荐

JSAjax的请求函数(1)

ajax:一种请求数据的方式,不需要刷新整个页面; ajax的技术核心是 XMLHttpRequest 对象; ajax 请求过程:创建 XMLHttpRequest 对象、连接服务器、发送请求、接收响应数据;function ajax(url,fnSucc,fnFaild){//1.创建Ajax对象if(window.XMLHttpRequest) //虽然没定义,但是以属性形式存在,所以不

十里春风不如你 2367

JS中的ajax

Ajax –1,概述 Ajax 即Asynchronous Javascript And XML( 异步的JS和XML ) Ajax是多种技术的综合应用 Ajax是客户端的技术,它可以实现 局部刷新 网页 Ajax 可以在不重新加载整个网页的情况下,与服务器交换数据,并且更新部分网页 ajax优势: 异步访问(加快响应速度,不必等待),局部刷新(不必刷新整个网页,只是局部刷新) AJAX编程步骤 1.创建XMLHttpRequest对象 2.设置请求方式 3.调用回调函数 4.发送请求 5.处理

weixin_55309235的博客 1525

JS 中如何使用 Ajax 来进行请求

正值金三银四招聘旺季,很多小伙伴都询问我有没有前端方面的面试题,特地整理出来赠送给大家!资料领取方式:点击这里前往获取既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上前端开发知识点,真正体系化![外链图片转存中…(img-2sA6nVPY-1712669410774)]由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!如果你觉得这些内容对你有帮助,可以扫码获取!!

peixiancccc的博客 1334

js封装 Ajax ——常用工具函数

在前端开发中,ajax的重要性不言而喻,所以我开始试着封装自己专属ajax1.常规封装 /* 封装ajax函数 * @param {string}opt.method http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @param {boolean}opt.as...

weixin_33940102的博客 2203

js ajax abort,javascript-如何停止函数内的Ajax调用

仅当用户按下“提交”按钮或按下Enter键时,才调用newMessage()函数.问题在于,即使未调用newMessage(),AJAX脚本也会继续在内部调用.例如,如果我在输入字段上键入任何内容而没有点击提交,则该值将由AJAX传递.我似乎无法理解如何停止此操作,我们将不胜感激.谢谢.function newMessage() {message = $(".message-input input...

weixin_42393245的博客 354

dz论坛 ajax请求,DISCUZ架构:AJAXajax.js 函数之二

有了这些理论的基础就可以分析一下ajax的具体实现了,下面就以注册过程中的检查用户名在数据库是不是存在并给用户提示这样一个ajax过程进行全程分析。用到如下的几个文件:以下为引用的内容:./register.php./ajax.php./include/javascript/common.js./include/javascript/ajax.js./template/default/regist...

weixin_32058239的博客 572

js函数返回ajax的值无效,JavaScript变量未从AJAX函数返回

随着框架的发展,我决定将其拆分为文件,而不是将其保留在主设计文件中。但是通过这样做,函数的返回不会返回任何值。数据不为空-如果我警告js文件中的值,它们在那里!功能:1 .js文件中的函数(在执行之前包含)var lock_get = 0;function get_data(data, destination){if (lock_get == 0){lock_get = 1;$.ajax({typ...

weixin_29910561的博客 445

ajax函数使用实例,纯js封装的ajax功能函数与用法示例

本文实例讲述了纯js封装的ajax功能函数与用法。分享给大家供大家参考,具体如下:AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)AJAX 不是新的编程语言,而是一种使用现有标准的新方法。是7种技术的综合,它包含了七个技术(javascript xml xstl xhtml dom xmlhttprequest , css),...

weixin_30417063的博客 248

ajax获取php cookie,JS获取dom对象ajax操作读写cookie函数_javascript技巧

代码如下:var LF = {};LF.version = '1.0.0';//全局函数function $(objName) {return document.getElementById(objName);}function $name(objName) {return document.getElementsByName(objName);}function $tag(objName) {r...

weixin_30346649的博客 155

jsajax函数,一些不错的js函数ajax

//创建组件function createobj() {if (window.ActiveXObject) {return(new ActiveXObject("Microsoft.XMLHTTP"));}else if (window.XMLHttpRequest) {return(new XMLHttpRequest());}}var cs;//发送请求function sxs(Fileid)...

weixin_39630410的博客 338

ajaxjs拼接字符串时带有函数函数带有参数的拼接格式问题

    小菜鸟的我今天在使用ajax拉取出数据,拼接字符串时就遇到了需要带函数带参数的拼接。需求是当我点击某一个链接时会触发一个事件,需要拼接函数名称而且动态传入参数,结果参数引号一直引起js报错,经过查询后,正确的写法应该是下面的这两个,在这里记录一下防止以后再用到:    1.当拼接的函数只有一个参数时,只需要在方法上加转义字符,参数加单引号即可"&lt;a href='javascript:...

weixin_zsh的博客 1894

js ajax php函数吗,JS如何实现Ajax的请求函数

这次给大家带来JS如何实现Ajax的请求函数JS实现Ajax请求函数的注意事项有哪些,下面就是实战案例,一起来看一下。一般我们写网页的时候,如果用到 Ajax 请求服务器,都是使用 JQuery 等已经封装好的库来调用,比较简单。但是一般这些库的功能很多,引入了太多我们用不到的东西,如果我们需要写一个功能单一,简单的页面,完全用不到引用如此庞大的库文件。我们可以简单实现一个自己的 Ajax 请求...

weixin_33642922的博客 176

js函数调用另一个包含ajax函数返回问题

js过长时需要封装成不同的小功能,发现在函数调用另一个包含ajax函数时,返回值有问题,百度了一圈没找到答案,去了stackoverflow上找,答案有点复杂是这样的。 这是国外网友的问题,加了异步为否之后,返回值仍是undefined (重点在下面,没采用国外网友的答案) 答案是这样的 有人回答加callback函数,我觉得不好,这个在调用函数那比较麻烦.所以没有采用。 这里是重点: 研...

程序媛 4645

Ajax中看javascript语法(函数篇)

Ajax中看javascript语法(函数篇)作者:llinzzi 日期:2006-03-26Ajax应用里有这么个语句相比大家都很熟悉xmlHttp.onreadystatechange = processRequest 就是当返回状态 改变的时候运行processRequest函数,而在processRequest函数中判断状态值,不一样的状态值运行不同的程序进行处理,但有时候  p

myfreeway的专栏 995

JavaScript EE,第 2 部分: 用 Ajax 调用远程 JavaScript 函数

JavaScript EE,第 2 部分: 用 Ajax 调用远程 JavaScript 函数 JavaScript EE,第 2 部分: 用 Ajax 调用远程 JavaScript 函数JavaScript EE,第 2 部分: 用 Ajax 调用远程 Java...

214

js中包含ajax函数设置返回值及传递数据

一.AJAX设置返回值 js函数设置返回值用return关键即可 但是如果需要返回的数据是通过AJAX的回调函数来设置的,调用此函数可能无法得到正确的返回值, 是因为ajax为异步执行,在js进行返回的时候ajax的回调函数可能还未获取到需要返回的数据,就会导致JS函数返回值为undefined; 如果使用$.get()方法,可以在此方法前设置$.ajaxSettings.as...

weixin_30610755的博客 751

js运用Ajaxphp中取值,使用ajax / javascript调用php函数

好的,我知道有人问过这个问题,但是我对PHP和JavaScript还是很陌生,直到我开始寻找这个问题的答案之前,我才听说过Ajax,所以不理解以前的答案。我正在创建一个站点,该站点本质上是SQL数据库中的一堆视频,它一次显示一个视频,我想要一个下一个和上一个视频按钮。但是我无法摆脱这种ajax的问题​​,所以我的问题更加简单。我已经复制了确切的代码,function doSomething() {...

weixin_30673943的博客 339

js回调函数配合ajax

1.js代码 开启服务器访问这个html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="js/jquery-2.1.3...

乔木晨子的博客 359
上一篇: firefox XPCOM Interface Reference
下一篇: 通过iframe hash 实现跨域
java_mail_test
博客等级 码龄17年 1粉丝 299原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值