zoukankan      html  css  js  c++  java
  • JS 实现AJAX封装(只限于异步)

    1.AJAX 分为异步 和 同步 请求

          比如你去买一个食品,但是商店暂时没有这个食品

            异步:等到商品有了再来买,这个期间我可以去做别的事;

            同步:一直在这里等,什么时候商品来了,买到手了,再去做别的事;

        下面我写了一个封装的函数,作为了解,使用的话建议使用JQ的AJAX

        

        function Ajaxget(option,fnSucc,fnFaild){
            /*url   请求路径
              getOrPost  get还是post请求
              str        post发送的字符串
             fnSucc      成功函数
             fnFaild     失败函数
            */
            var arument = {
                getUrl : option.url,
                getOrPost : option.getOrPost,
                postSendStr : option.str
            }
            if(window.XMLHttpRequest){
                var xhr = new XMLHttpRequest();
            }else{
                var xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            if(arument.getOrPost === 'get'){
                xhr.open("GET",arument.getUrl,true);
                xhr.send();
            }else if(arument.getOrPost === 'post'){
                xhr.open("POST",arument.getUrl,true);
                xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
                xhr.send(arument.postSendStr)
            }
            xhr.onreadystatechange = function(){
                if(xhr.readyState == 4 && xhr.status == 200){
                    fnSucc(xhr.responseText)
                    // document.write(xhr.responseText);
                }else{
                    if(fnFaild){
                         fnFaild();
                    }
                }
            }
        }

    调用请求部分

        Ajaxget({
             url:'http://sjz.bokanedu.com/tgr/api/index.aspx?day=4-5&type=bkws',
             getOrPost:'get',
             str:''
        },function(e){
             document.write(e);
        },function(){
            console.log('失败')
        })

    请求数据如下:

  • 相关阅读:
    浅谈 iOS 事件的传递和响应过程
    iOS 之渐变颜色
    系统enum的一些样式
    Storyboard操作的2个小技巧
    iOS 动画初步
    iOS之Runtime初应用
    Block使有注意点
    使用ios系统自带分享
    IOS原生地图与高德地图
    反向传值实例
  • 原文地址:https://www.cnblogs.com/my-effort/p/6134779.html
Copyright © 2011-2022 走看看