Ajax 의 순환 방안

Ajax 소개
Ajax 는 HTML,JavaScript 에서™ 기술,DHTML,DOM 으로 구성 되 어 있 으 며,이 뛰어난 방법 은 서 툰 웹 인 터 페 이 스 를 상호작용 적 인 Ajax 응용 프로그램 으로 전환 시 킬 수 있다.본 논문 의 저 자 는 Ajax 전문가 이다.그 는 이러한 기술 들 이 어떻게 협동 작업 을 하 는 지 보 여 주 었 다.전체적인 개술 에서 세부 적 인 토론 까지 효율 적 인 웹 개발 을 현실 로 만 들 었 다.그 는 XML HttpRequest 대상 을 포함 한 Ajax 핵심 개념의 베일 도 벗 겼 다.
5 년 전 XML 을 몰 랐 다 면 당신 은 아무 도 중시 하지 않 는 미 운 오리 새끼 였 습 니 다.18 개 월 전 루비 는 관심 의 중심 이 되 었 고 루비 의 프로그래머 는 냉대 를 받 을 수 밖 에 없 었 다.오늘 최신 기술 패션 을 따라 잡 으 려 면 당신 의 목 표 는 Ajax 입 니 다.
그러나 Ajax 는 패션 뿐만 아니 라 사 이 트 를 구축 하 는 강력 한 방법 일 뿐만 아니 라 새로운 언어 를 배 우 는 것 처럼 어렵 지 않다.
업무 수요
개발 중,목록 페이지 를 불 러 오 는 것 이 완료 되면,목록 의 모든 항목 의 id 에 따라 서버 에 가서 해당 하 는 데 이 터 를 가 져 온 다음,가 져 온 데 이 터 를 현재 id 에 대응 하 는 탭 에 부여 해 야 합 니 다.
예 를 들 어 다음 표:

저 는 일련의 상품 번 호 를 가지 고 있 습 니 다.저 는 상품 번호 에 따라 ajax 를 통 해 서버 에 가서 상품 에 대응 하 는 이름 을 얻 은 다음 에 js 로 인터페이스 를 업데이트 해 야 합 니 다.(실제 업 무 는 당연히 상품 이름 을 얻 는 것 이 이렇게 간단 한 것 이 아 닙 니 다)
2.실현 방안
2.1 오류 방안
일반적인 상황 에서 우 리 는 직접 for 순환 을 쓰 고 순환 내 에 ajax 를 시작 하여 데 이 터 를 가 져 오 라 고 요청 한 다음 에 가 져 온 데 이 터 를 해당 하 는 id 에 대응 하 는 탭 에 업데이트 하 는 것 을 생각 합 니 다.
다음 과 같다.
우 리 는 배열 로 열 id 를 모 의 합 니 다.

var array = [1, 3, 2, 5, 3];

순환 하 는 ajax 요청 방법:

function foreach_ajax() {
for (var i = 0; i < array.length; i++) {
$.get("/home/loop_ajax", { value: array[i] }, function (data) {
console.log(array[i]+","+data);
});
}
}

호출:

$(function () {
foreach_ajax(); 
});

테스트 결 과 는 다음 과 같다.

순환 하 는 내부 에서 우 리 는 array[i]의 값 을 전혀 얻 지 못 하 는 것 을 볼 수 있다.
이러한 결 과 를 초래 한 이 유 는 ajax 가 비동기 로 실행 되 었 기 때 문 입 니 다.순환 이 끝 났 을 때 첫 번 째 ajax 는 서버 데 이 터 를 되 돌려 주지 않 았 고 순환 이 끝 났 을 때 for 의 변수 i 가 방출 되 었 기 때문에 array[i]=undefined
2.2 정확 한 방안
정확 한 방식 은 재 귀적 인 방식 으로 ajax 를 순환 하 는 것 입 니 다.
다음 과 같다.
우 리 는 배열 로 열 id 를 모 의 합 니 다.

var array = [1, 3, 2, 5, 3];

재 귀적 ajax 요청 방법:

function Loop_ajax(index, array) {
if (index < array.length) { 
var value = array[index];
$.get("/home/loop_ajax", { value: value }, function (data) {
console.log(array[index] + "," + data);
if (index < array.length) {
Loop_ajax(index + 1, array); 
}
});
}
}

호출:

$(function () {
Loop_ajax(0, array);
});

테스트 결 과 는 다음 과 같다.

위 에서 말 한 것 은 편집장 님 께 서 소개 해 주신 Ajax 의 순환 방안 입 니 다.여러분 께 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.편집장 님 께 서 바로 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!