집 >웹 프론트엔드 >JS 튜토리얼 >JQuery로 Ajax를 캡슐화하는 일반적인 방법 공유

JQuery로 Ajax를 캡슐화하는 일반적인 방법 공유

小云云원래의: 2018-01-11 13:52:491299검색

easy-ajax는 프런트엔드에서 Ajax 메서드의 무작위 쓰기를 제어하기 위해 탄생했습니다. 다음으로, 이 기사에서는 JQuery로 Ajax를 캡슐화하는 일반적인 방법을 소개합니다. 필요한 친구가 참고하면 도움이 될 것입니다.

easy-ajax가 필요한 이유

easy-ajax는 프런트 엔드에서 Ajax 메서드의 임의 쓰기를 제어하기 위해 탄생했습니다. 몇 가지 일반적인 방법을 캡슐화하는 jquery를 기반으로 향후 프런트 엔드 데이터 캐싱 기능을 추가할 계획입니다.

사용 방법은 다음과 같습니다.

<script src="easy.ajax.js"></script>

API:

config 구성 항목:

config{
  jqueryAjax默认配置外增加如下配置：
  mustCallback：强制回调（很多情况请求失败后直接在Ajax中提示后端返回的错误信息就结束了，不会进入回调函数，但很难避免失败也需要处理逻辑的情况，所以增加了此项配置，无论成功失败皆执行配置中的callback，前提是有回掉函数。）
}

from form 메서드를 사용하여 매개변수 요청 배경을 처리합니다(인터페이스가 @RequestParam)

EasyAjax.post_form_json

일반적인 요청 방법 사용(인터페이스가 @RequestBody를 사용할 때 사용)

EasyAjax.post_json

파일 업로드 방법 1:

var file = $(".xxx").get(0).files[0];
var fileData = new FormData();
fileData.append("file", file);
EasyAjax.ajax_Upload_File({
          url: "URL",
          data: fileData
        },
        function (data) {
          if (data.success) {
            //上传成功
          }
        });

파일 업로드 방법 2:

elem 메소드를 직접 구성하고 다음과 같이 사용하세요.

EasyAjax.ajax_Upload_File_Elem({
          url:"URL"
          , elem: "#icon"
        },function (res) {
          if (res.success) {
            //上传成功
          }
        });

JQuery로 Ajax를 캡슐화하는 일반적인 방법 공유

관련 기사