前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >简单的封装ajax函数

简单的封装ajax函数

作者头像
游魂
发布2018-06-08 16:56:01
7950
发布2018-06-08 16:56:01
举报
文章被收录于专栏:前端开发前端开发前端开发
//封装一个ajax函数

  // 参数约定:
    // url  必须
    // method 可选, 默认是 get
    // data 可选, 可以是字符串, 也可以是对象( 键值对 )
    // fn 处理响应回来的数据, 函数需要有参数, 即响应回来的数据

function ajax( options ){
    //定义参数
   var url=options.url,
        method=options.method || "GET",
        data=options.data || null,
        fn=options.fn || null

    //首先转换data参数
    var tmp=[];
    //如果传入的是字符串,不需要处理,如果传入的是一个键值对,转换成字符串
    if(data != null && typeof data =="object"){
        for( var k in data){
            tmp.push(k + "=" + data[k] );
        }
        data=tmp.join("&");
    }

    //开始发送ajax请求
    var xhr=new XMLHttpRequest();
    xhr.open(method,url);
    //如果请求方式是post  设置头
    if( method.toLowerCase() == "post"){
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    }
    xhr.onreadystatechange=function(){
        if( xhr.readyState===4 && xhr.status==200){
            if(typeof fn =="function"){
                fn( xhr.responseText );
            }
        }
    };
    xhr.send(data);
};
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2017-9-26 1,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档