• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > 封装了jQuery的Ajax请求全局配置

封装了jQuery的Ajax请求全局配置

作者: 字体:[增加 减小] 来源:互联网 时间:2017-08-16

通过本文主要向大家介绍了jQuery,Ajax请求等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

摘要:

  jQuery已经成为项目中最常见的js库,也是前端开发最喜欢使用的库。下面是在项目中封装了jQuery的Ajax,分享给大家。

代码:

// ajax 请求参数
var ajaxSettings = function(opt) {
    var url = opt.url;
    var href = location.href;
    // 判断是否跨域请求
    var requestType = 'jsonp';
    if (url.indexOf(location.host) > -1)
        requestType = 'json';
    requestType = opt.dataType || requestType;
    // 是否异步请求
    var async = (opt.async === undefined ? true : opt.async);
    return {
        url: url,
        async: async,
        type: opt.type || 'get',
        dataType: requestType,
        cache: false,
        data: opt.data,
        success: function(data, textStatus, xhr) {
            /*
            *如果dataType是json,怎判断返回数据是否为json格式,如果不是进行转换
            * 成功数据通用格式
            *   {
            *       "code": 200,
            *       "data": [],
            *       "success": true // 成功
            *   }
            *   失败返回的数据
            *   {
            *       "code": 200,
            *       "info": 'error',
            *       "success": false // 失败
            *   }
             */
            if((requestType === 'json' || requestType === "jsonp") && typeof(data) === "string") {
                data = JSON.parse(data);
            }
            if(data.success) {
                opt.success(data);
            }

            if(opt.error) {
                opt.error(data);
            }

        },
        error: function(xhr, status, handler) {
            if (opt.error)
                opt.error();
        }
    };
};
function unescapeEntity(str) {
    var reg = /&(?:nbsp|#160|lt|#60|gt|62|amp|#38|quot|#34|cent|#162|pound|#163|yen|#165|euro|#8364|sect|#167|copy|#169|reg|#174|trade|#8482|times|#215|divide|#247);/g,
        entity = {
        ' '   : ' ',
        ' '   : ' ',
        '<'     : '<',
        '<'    : '<',
        '>'     : '>',
        '&62;'     : '>',
        '&'    : '&',
        '&'    : '&',
        '"'   : '"',
        '"'    : '"',
        '¢'   : '¢',
        '¢'   : '¢',
        '£'  : '£',
        '£'   : '£',
        '¥'    : '¥',
        '¥'   : '¥',
        '€'   : '€',
        '€'  : '€',
        '§'   : '§',
        '§'   : '§',
        '©'   : '©',
        '©'   : '©',
        '®'    : '®',
        '®'   : '®',
        '™'  : '™',
        '™'  : '™',
        '×'  : '×',
        '×'   : '×',
        '÷' : '÷',
        '÷'   : '÷'
    };
    if (str === null) {
        return '';
    }
    str = str.toString();
    return str.indexOf(';') < 0 ? str : str.replace(reg, function(chars) {
        return entity[chars];
    });
}
// 转换html的实体
$.ajaxSetup({
    global     : true,
    cache      : false,
    converters : {
        'text json' : function(response){
            return jQuery.parseJSON(unescapeEntity(response));
        }
    }
});
/*
*Ajax 请求权限异常
*   用户权限错误跳转登陆页
*   404错误跳转404页面
 */
$(document).ajaxComplete(function(evt, req, settings){
    if(req && req.responseJSON){
        var json = req.responseJSON;
        if(json.code === 403 && json.info === 'perm error' && !json.success){
            window.location.href = location.protocol + '//' + location.hostname;
            return;
        }
        if(json.code === 404 && !json.success) {
            window.location.href = location.protocol + '//' + location.hostname + '/404.html';
        }
    }
});
/*
*Ajax 请求错误提示
*例如:500错误
*返回错误信息格式
*{
*   code: 500,
*   info: 系统发生异常
*}
 */
$(document).ajaxError(function(evt, req, settings){
    if(req && (req.status === 200||req.status === 0)){ return false; }
    var msg = '错误:';
    if(req && req.responseJSON){
        var json = req.responseJSON;
        msg += json.code||'';
        msg += json.info||'系统异常,请重试';
    }else{
        msg = '系统异常,请重试';
    }
    alert(msg);
});

小结:

  在执行Ajax请求时只需要调用ajaxSettings函数即可,如下:

$.ajax(ajaxSettings({
    url: '',
    data: ''
}))

以上所述就是本文的全部内容了,希望大家能够喜欢。

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 基于jQuery对象和DOM对象和字符串之间的转化实例
  • jquery+css实现简单的图片轮播效果
  • 使用jQuery实现鼠标点击左右按钮滑动切换
  • jQuery实现上传图片前预览效果功能
  • jQuery初级教程之网站品牌列表效果
  • 基于jquery实现多选下拉列表
  • jQuery接受后台传递的List的实例详解
  • 详解jquery选择器的原理
  • jQuery上传插件webupload使用方法
  • 关于jquery form表单序列化的注意事项详解

相关文章

  • 2017-08-16jquery插件uploadify多图上传功能实现代码
  • 2017-08-16jQuery超简单选项卡完整实例
  • 2017-08-16jQuery中:visible选择器用法实例
  • 2017-08-16JQuery中DOM实现事件移除的方法
  • 2017-08-16jQuery中prevAll()方法用法实例
  • 2017-08-16jquery中one()方法的用法实例
  • 2017-08-16jQuery移动和复制dom节点实用DOM操作案例
  • 2017-08-16JQuery伸缩导航练习示例
  • 2017-08-16jQuery热气球动画半透明背景的后台登录界面代码分享
  • 2017-08-16基于jquery实现鼠标滚轮驱动的图片切换效果

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • jquery 简单的图片展示效果
    • jQuery中:last选择器用法实例
    • 简单易用的基于jQuery版仿新浪微博向下滚动效果(附DEMO)
    • Jquery实时监听input value的实例
    • Ionic实现仿通讯录点击滑动及$ionicscrolldelegate使用分析
    • jquery模拟按下回车实现代码
    • jQuery使用hide方法隐藏页面上指定元素的方法
    • jQuery图片加载显示loading效果
    • JQuery实现定时刷新功能代码
    • jQuery树控件zTree使用方法详解(一)

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有