<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
</title>
<script>
var xmlHttp;
window.onload=function()
{
// 1. 브라우저에 따른 XMLHttpRequest 생성
xmlHttp = createXMLHTTPObject();
// 2. 요청에 대한 응답 처리 이벤트 리스너 등록
xmlHttp.onreadystatechange=on_ReadyStateChance;
// 3. 서버로 보낼 데이터 생성
var data = "key=value1&key2=value2";
// 4. 클라이언트와 서버 간의 연결 요청 준비(open() 메서드 이용)
// 4-1 서버로 보낼 데이터 전송 방식 설정, 대부분 [ GET,POST ] 둘중 하나를 지정
// 4-2 서버 측 응답 방식 설정 [ 동기 , 비동기 ] 중 선택
// 5. 실제 데이터 전송(send() 메서드 이용)
// T. 동기/비동기 실행 테스트를 위한 부분
alert("전송시작!")
}
// 1. 브라우저에 따른 XMLHttpRequest 생성
function createXMLHTTPObject() {
var xhr = null;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
return xhr;
}
// 6, 웅답 처리
function on_ReadyStateChange() {
// 4 = 데이터 전송 완료. ( 0 =초기화 전, 1=로딩중. 2=로딩됨, 3,대화 중 상태)
if (xmlHttp.readyState == 4) {
// 200은 에러없음 404는 페이지가 존재하지 않음
if (xmlHttp.status == 200) {
}
//7. 이제 이 부분에서 서버에서 보낸 데이터를 XML,JSON,CSV에 따라 처리함.
}
else {
alert("처리 중 에러 발생")
}
}
</script>
</head>
</html>
'Program > JavaScript' 카테고리의 다른 글
IE, 크롬, 파이어폭스에서 자바스크립트 달력( calendar.js )을 사용하기 (0) | 2016.01.19 |
---|---|
event.stopPropagation(), event.preventDefault () 이해하기 (0) | 2016.01.19 |
[Ajax] jquery 실시간 중복체크 (0) | 2015.12.18 |
JavaScript-배열 (0) | 2015.07.25 |
Json 기본예제(버튼이벤트-반복문) (0) | 2015.07.25 |