jQuery Ajax 인 스 턴 스 상세 설명($.ajax,$.post,$.get)

12918 단어 jqueryajax실례getpost
Jquery 는 비동기 제출 에 있어 서 잘 밀봉 되 어 있 습 니 다.AJAX 를 직접 사용 하 는 것 은 매우 번 거 롭 습 니 다.Jquery 는 우리 의 조작 을 크게 간소화 하 였 으 니 브 라 우 저의 의아 함 을 고려 할 필요 가 없습니다.
괜 찮 은 jQuery Ajax 인 스 턴 스 글 을 추천 합 니 다.가 볼 수 있 는 것 을 잊 었 습 니 다.
주소:https://www.jb51.net/article/26903.htm
$.post,$.get 은 간단 한 방법 입 니 다.복잡 한 논 리 를 처리 하려 면 jQuery.ajax()를 사용 해 야 합 니 다.
1.$.ajax 의 일반 형식

$.ajax({
  type: 'POST',
  url: url ,
 data: data ,
 success: success ,
 dataType: dataType
});
2.$.ajax 의 매개 변수 설명
매개 변수 설명
url
필수요청 을 어느 URL 로 보 낼 지 설정 합 니 다.
data
선택 할 수 있다.맵 이나 문자열 값.요청 과 함께 서버 에 보 낼 데 이 터 를 규정 합 니 다.
success(data, textStatus, jqXHR)
선택 할 수 있다.요청 이 성공 할 때 실행 되 는 반전 함수 입 니 다.
dataType
선택 할 수 있다.예상 한 서버 응답 데이터 형식 을 지정 합 니 다.
기본적으로 스마트 판단(xml,json,script 또는 html)을 실행 합 니 다.
3.$.ajax 가 주의해 야 할 부분:
  1.data 의 주요 방식 은 세 가지 가 있 는데 html 로 연 결 된 json 배열,form 폼 은 serialize()를 통 해 직렬 화 된 것 이다.dataType 지정 을 통 해 스마트 판단 을 지정 하지 않 습 니 다.
  2.$.ajax 는 form 만 텍스트 로 제출 합 니 다.비동기 제출 에업로드 가 전달 되 지 않 으 면 jquery.form.js 의$.ajaxsubmit 를 사용 해 야 합 니 다.
4.$.ajax 나의 실제 응용 예

//.$.ajax json       
 var aj = $.ajax( { 
  url:'productManager_reverseUpdate',//     action 
  data:{ 
    selRollBack : selRollBack, 
    selOperatorsCode : selOperatorsCode, 
    PROVINCECODE : PROVINCECODE, 
    pass : pass 
  }, 
  type:'post', 
  cache:false, 
  dataType:'json', 
  success:function(data) { 
   if(data.msg =="true" ){ 
    // view("    ！"); 
    alert("    ！"); 
    window.location.reload(); 
   }else{ 
    view(data.msg); 
   } 
  }, 
  error : function() { 
   // view("  ！"); 
   alert("  ！"); 
  } 
 });
 //.$.ajax                
 function noTips(){ 
  var formParam = $("#form").serialize();//            
  $.ajax({ 
   type:'post',  
   url:'Notice_noTipsNotice', 
   data:formParam, 
   cache:false, 
   dataType:'json', 
   success:function(data){ 
   } 
  }); 
 } 
 //.$.ajax  url     
 var yz=$.ajax({ 
  type:'post', 
  url:'validatePwd_checkPwd?password='+password, 
  data:{}, 
  cache:false, 
  dataType:'json', 
  success:function(data){ 
   if( data.msg =="false" ) //     false，  validatePassword    pwdError，    ，         
   { 
    textPassword.html("<font color='red'>       ！</font>"); 
    $("#validatePassword").val("pwdError"); 
    checkPassword = false; 
    return; 
   } 
  }, 
  error:function(){} 
 }); 
 //.$.ajax  data     
 $.ajax({ 
  url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action', 
  type:'post', 
  data:'merName='+values, 
  async : false, //   true    
  error:function(){ 
  alert('error'); 
  }, 
  success:function(data){ 
  $("#"+divs).html(data); 
  }
 });
 다음은 ajax()가 큰 표 인 자 를 제공 하기 때문에 매우 복잡 한 기능 을 실현 할 수 있 습 니 다.
매개 변수 이름
유형
묘사 하 다.
url
String
(기본 값:현재 페이지 주소)요청 한 주 소 를 보 냅 니 다.
type
String
(기본 값:"GET")요청 방식("POST"또는"GET"),기본 값 은"GET"입 니 다.
메모:PUT 와 DELETE 같은 다른 HTTP 요청 방법 도 사용 할 수 있 지만 일부 브 라 우 저 만 지원 합 니 다.
timeout
Number
요청 시간 초과(밀리초)를 설정 합 니 다.이 설정 은 전역 설정 을 덮어 씁 니 다.
async
Boolean
(기본 값:true)기본 설정 에서 모든 요청 은 비동기 요청 입 니 다.
동기 화 요청 을 보 내 려 면 이 옵션 을 false 로 설정 하 십시오.
동기 화 요청 은 브 라 우 저 를 잠 그 고 사용자 의 다른 작업 은 요청 이 완료 되 기 를 기 다 려 야 실행 할 수 있 습 니 다.
beforeSend
Function
요청 을 보 내기 전에 사용자 정의 HTTP 헤드 를 추가 하 는 등 XML HttpRequest 대상 의 함 수 를 수정 할 수 있 습 니 다.
XML HttpRequest 대상 은 유일한 인자 입 니 다.
[javascript]  view plain copy
function (XMLHttpRequest) {   this; // the options for this ajax request   }   cache
Boolean
(기본 값:true)jQuery 1.2 새 기능 입 니 다.false 로 설정 하면 브 라 우 저 캐 시 에서 요청 정 보 를 불 러 오지 않 습 니 다.
complete
Function
요청 완료 후 리 셋 함수(요청 이 성공 하거나 실 패 했 을 때 모두 호출).
인자:XML HttpRequest 대상,성공 정보 문자열.
[javascript]  view plain copy
function (XMLHttpRequest, textStatus) {   this; // the options for this ajax request   }   contentType
String
(기본 값:"application/x-www-form-urlencoded")서버 에 메 시 지 를 보 낼 때 내용 인 코딩 형식 입 니 다.기본 값 은 대부분의 응용 장소 에 적합 합 니 다.
data
Object,
String
서버 에 보 낸 데이터 입 니 다.요청 문자열 형식 으로 자동 변환 합 니 다.GET 요청 은 URL 뒤에 추 가 됩 니 다.
이 자동 변환 을 금지 하기 위해 processData 옵션 설명 을 보십시오.Key/Value 형식 이 어야 합 니 다.
배열 이 라면 jQuery 는 자동 으로 다른 값 으로 같은 이름 에 대응 합 니 다.
예 를 들 어{foo:["bar 1","bar 2"]}을'&foo=bar 1&foo=bar 2'로 전환 합 니 다.
dataType
String
예상 서버 가 되 돌아 오 는 데이터 형식 입 니 다.지정 하지 않 으 면 jQuery 는 자동 으로 HTTP 패키지 MIME 정보 에 따라
responseXML 또는 responseText 를 되 돌려 주 고 리 셋 함수 매개 변수 로 전달 합 니 다.사용 가능 한 값:
"xml":XML 문 서 를 되 돌려 줍 니 다.jQuery 로 처리 할 수 있 습 니 다.
"html":텍스트 HTML 정 보 를 되 돌려 줍 니 다.script 요 소 를 포함 합 니 다.
"script":텍스트 자 바스 크 립 트 코드 를 되 돌려 줍 니 다.결 과 를 자동 으로 캐 시 하지 않 습 니 다.
"json":JSON 데 이 터 를 되 돌려 줍 니 다.
“jsonp”:  JSONP  격식쓰다  JSONP  형식 호출 함수 시,
예 를 들 어"my url?callback=?"jQuery 는 자동 으로 바 뀝 니까?정확 한 함수 명 을 위해 리 셋 함 수 를 실행 합 니 다.
error
Function
(기본 값:자동 판단(xml 또는 html)요청 이 실 패 했 을 때 이 방법 을 사용 합 니 다.
이 방법 은 세 가지 인자 가 있 습 니 다.XML HttpRequest 대상,오류 정보,(가능)캡 처 된 오류 대상 입 니 다.
[javascript]  view plain copy
function (XMLHttpRequest, textStatus, errorThrown) {   // 일반적인 상황 에서 textStatus 와 error Thown 은 그 중 하나 만 값 이 있 습 니 다.   this; // the options for this ajax request   }   global
Boolean
(기본 값:true)전역 AJAX 이 벤트 를 실행 할 지 여부 입 니 다.false 로 설정 하면 전역 AJAX 이벤트 가 일어나 지 않 습 니 다.
ajax Start 나 ajax Stop 같은 경우.다른 Ajax 이벤트 제어 에 사용 가능
ifModified
Boolean
(기본 값:false)서버 데이터 가 바 뀔 때 만 새 데 이 터 를 가 져 옵 니 다.
HTTP 패키지 Last-Modified 헤더 정 보 를 사용 하여 판단 합 니 다.
processData
Boolean
(기본 값:true)기본 값 으로 보 낸 데 이 터 는 대상 으로 변 환 됩 니 다.(기술적 으로 문자열 이 아 닙 니 다)
기본 콘 텐 츠 형식 인"application/x-ww-form-urlencoded"에 맞 게 합 니 다.
DOM 트 리 메 시 지 를 보 내 거나 다른 변환 을 원 하지 않 는 메 시 지 를 보 내 려 면 false 로 설정 하 십시오.
success
Function
요청 성공 후 리 셋 함수.이 방법 은 두 가지 인자 가 있 습 니 다.서버 가 데 이 터 를 되 돌려 주 고 상 태 를 되 돌려 줍 니 다.
[javascript]  view plain copy
function (data, textStatus) {   // data could be xmlDoc, jsonObj, html, text, etc...   this;    // the options for this ajax request   }   이상 에서 말 한 것 은 본 고 에서 소개 한 jQuery Ajax 인 스 턴 스 상세 설명($.ajax,$.post,$.get)에 관 한 자료 입 니 다.jquery ajax 인 스 턴 스 를 배 우 는 데 도움 이 되 기 를 바 랍 니 다.
ES6 개체 조작 실례 상세 설명
AJAX 의 핵심 대상 에 대해 간단히 이야기 하 겠 습 니 다.

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage