> 웹 프론트엔드 > JS 튜토리얼 > Ajax는 jQuery_jquery를 캡슐화하는 전역 구성을 요청합니다.

Ajax는 jQuery_jquery를 캡슐화하는 전역 구성을 요청합니다.

WBOY
풀어 주다: 2016-05-16 16:15:50
원래의
1438명이 탐색했습니다.

요약:

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 || // 비동기적으로 요청할지 여부
var async = (opt.async === 정의되지 않음 ? true : opt.async);
복귀 {
  url: url,
비동기: 비동기,
         유형: opt.type 'get',
데이터 유형: 요청 유형,
캐시: 거짓,
데이터: opt.data,
성공: 함수(data, textStatus, xhr) {
               /*
*dataType이 json인 경우 반환된 데이터가 json 형식인지 확인하는 방법이 없다면 변환하세요.
* 성공 데이터의 공통 형식
                 *                                          "코드": 200,
"데이터": [],
>                                     *                                           * 실패 시 반환되는 데이터
                 *                                          "코드": 200,
"정보": '오류',
"성공": 거짓 // 실패                  *                                                           */
If((requestType === 'json' || requestType === "jsonp") && typeof(data) === "string") {
                  데이터 = JSON.parse(data);
            }
                 if(data.success) {
                     opt.success(데이터);
            }

if(opt.error) {
                    opt.error(데이터);
            }

        },
        오류: 함수(xhr, 상태, 처리기) {
            if (opt.error)
                opt.error();
        }
    };
};
함수 unescapeEntity(str) {
    var reg = /&(?:nbsp|#160|lt|#60|gt|62|amp|#38|quot|#34|센트|#162|파운드|#163|엔|#165|유로|# 8364|sect|#167|복사|#169|reg|#174|trade|#8482|times|#215|divide|#247);/g,
        엔터티 = {
        ' '   : ' ',
        ' '   : ' ',
        '<'     : '<',
        '<'    : '<',
        '>'     : '>',
        '&62;'     : '>',
        '&'    : '&',
        '&'    : '&',
        '"'   : '"',
        '"'    : '"',
        '¢'   : '¢',
        '¢'   : '¢',
        '£'  : '£',
        '£'   : '£',
        '\'    : '\',
        '\'   : '\',
        '€'   : '?',
        '€'  : '?',
        '§'   : '§',
        '§'   : '§',
        '©'   : '©',
        '©'   : '©',
        '®'    : '®',
        '®'   : '®',
        '™'  : '™',
        '™'  : '™',
        '×'  : '×',
        '×'   : '×',
        '¼' : '¼',
        '¼'   : '://'
    };
    if (str === null) {
        반환 '';
    }
    str = str.toString();
    return str.indexOf(';') < 0? str : str.replace(reg, function(chars) {
        엔터티[문자] 반환;
    });
}
// 转换html적형
$.ajaxSetup({
    글로벌     : 사실,
    캐시      : 거짓,
    변환기 : {
        'text json' : 함수(응답){
            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 = 위치.프로토콜 '//' 위치.호스트 이름;
            반품;
        }
        if(json.code === 404 && !json.success) {
                 window.location.href = location.protocol '//' location.hostname '/404.html';
}
}
});
/*
*Ajax 요청 오류 메시지
*예: 500 오류
*반환 오류 메시지 형식
*{
* 코드: 500,
* 정보: 시스템 예외
*}
*/
$(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||'시스템 예외, 다시 시도해 주세요';
}그밖에{
            msg = '시스템 예외입니다. 다시 시도해 주세요';
}
경고(msg);
});

요약:

Ajax 요청을 실행할 때 다음과 같이 ajaxSettings 함수만 호출하면 됩니다.

코드 복사 코드는 다음과 같습니다.

$.ajax(ajax설정({
URL: '',
데이터: ''
}))

위 내용은 이 글의 전체 내용입니다. 모두 마음에 드셨으면 좋겠습니다.

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿