zoukankan      html  css  js  c++  java
  • ajax 异步 封装 调用

    // 请求方法 封装    
    function getData(url, params, fn) {
         $.ajax({
                   type: "post",
                   url: url,
                   contentType: 'application/json;charset=UTF-8',//根据接口文档要求 请求类型
                   headers: {//预先设置的请求头
                            'Accept': 'application/json',
                           'Content-Type': 'application/json'
                   },
                  dataType: 'json',//返回数据类型
                  data: JSON.stringify(params),//返回数据,JSON.stringify 预处理json转字符
                  timeout: 20000,
                  success: function (data) {
                   fn.call(null, data);//请求成功执行回调函数
                 },
                 error: function(error) {
                     layer.msg('服务异常', {icon: 2});
                 }
            });
    }
    // 请求方法 get 
    function request(url, params, fn) {
              $.ajax({
                    url:url,
                    type:"get",
                   data:params,
                   async: false,
                   dataType:'json',
                   success:function(data){
                          if(data.result == 0) {
                               fn(data);
                          } else {
                         }
                     }
                })
    }
     
    -------------------------------------------------------------------------------------------------------封装ajax调用
    //初始化版本信息
    function initChn(defaultValue){
    var params = {};
    //获取渠道ID列表
    request(apis.qudaoID, params, function (data) {//apis.qudaoID 请求路径参数
    //请求成功 渲染到页面
    if (data.result == 0) { //result == 0  请求返回状态码  有所不同
    // 格式化数据
    var attrData = data.datas;
    // 默认渠道ID属性
    var defaultAttr = defaultOption.chnAttr;
    if(!defaultValue) {
    // 把查询的数据储存到本地
    defaultAttr = formatChnList(attrData.chnsList, 'channelID');
    defaultOption.chnAttr = defaultAttr;
    }
    // 渠道ID列表
    var list = formatChnList(attrData.chnsList, 'channelID');
    // console.log(list, '渠道Id列表');
    if (defaultAttr == "") {
    //渲染到页面 插件 
    $('#threeChanel').hsCheckData({ //hsCheckData 插件属性
    isShowCheckBox: true,
    data:list,
    });
    } else {
    // console.log('选择的渠道ID',defaultAttr);
    if(defaultAttr.indexOf('@@@') !== -1) {
    $('#threeChanel').hsCheckData({
    isShowCheckBox: true,
    data: list,
    defText: "",
    });
    return;
    } else {
    $('#threeChanel').hsCheckData({
    isShowCheckBox: true,
    data: list,
    defText:""
    });
    };
    }
    }
    });
     
    if(!defaultValue){//默认请求的数据
    params = {
    queryDate:"20181014",
    queryDateEnd:"20180903",
    productId:"1",
    prodClassName:"0",
    os:""
    };
    }
    // 获取版本列表
    getData(apis.dataTime,params,function(data){
    if(data.result == 0){
    var channelData = data.datas;
    let channelLet = defaultOption.productId;
    // 获取返回的数据 缓存到本地
    if(!defaultValue) {
    // 获取返回的数据 缓存到本地
    channelLet = channelData;
    defaultOption.productId = channelLet;
    }
    // console.log(channelLet, '版本数据');
    if (channelLet == "") {
    $('#secondChanel').hsCheckData({
    isShowCheckBox: true,//多选
    defText:"",//默认为空
    data: channelLet,
    });
    return;
    } else {//版本选择
    if(channelLet.indexOf('@@@') !== -1) {
    $('#secondChanel').hsCheckData({
    isShowCheckBox: true,
    data: channelLet,
    defText: "",
    });
    return;
    } else {
    $('#secondChanel').hsCheckData({
    isShowCheckBox: true,
    data: channelLet,
    defText:""
    });
    };
    }
    }
    });
    //初始化表格 和 列表
    setTimeout(function () {
    getChartData();
    getNewUser(null, 1);
    }, 17);
    }
  • 相关阅读:
    Project2016下载安装密钥激活教程破解
    关于 Level 和 Promotion,其实就那么简单
    Docker 入门
    Spring Cloud Config中文文档
    如何合理设置线程池大小
    java中线程池的使用
    快速掌握和使用Flyway
    duilib教程之duilib入门简明教程6.XML配置界面
    duilib教程之duilib入门简明教程5.自绘标题栏
    duilib教程之duilib入门简明教程4.响应按钮事件
  • 原文地址:https://www.cnblogs.com/hanlengyao/p/10062556.html
Copyright © 2011-2022 走看看