<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageENCODING="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<script type="text/javascript">
//XMLHttpRequest(요청객체)객체 생성하기
//HTTP 프로토콜을 이용해서 Request와 Response를 처리함.(web browser의 background에서
//XMLHttpRequest는 자바스크립트의 내장 객체임
var request = null; //XMLHttpRequest객체를 담을 전역변수
function createRequest()
{
try //ie가 아닌 웹브라우저..
{
request = new XMLHttpRequest();
}
catch(microsoft) //ie
{
try
{
request = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(otherMicrosoft)
{
try //Etc
{
request = new ActiveXObject("Microsoft.XMLHTTP");
}catch(fail)
{
request = null;
}
}
}
}
function goAjax()
{
createRequest();
//요청을 처리해줄 서버의 주소...
var url = "/ajax/demoServer.jsp";
//요청객체를 초기화 [방식(GET/POST), URL,(동기[false]/비동기[true])여부]
request.open("GET", url, true);
//요청객체의 상태가 바뀔때 마다 호출할 callback함수를 지정
request.onreadystatechange = updatePage;
//서버에 요청
//GET방식의 요청일때는 Content부분에 null을 입력.
request.send(null);
}
function updatePage()
{
//alert(request.readyState);
//responseText 를 이용
var result = "";
if(request.readyState == 4)
{
result = request.responseText;
//alert(result);
var infoDiv = document.getElementById("info");
infoDiv.innerHTML = result;
}
}
</script>
<body>
<div id="info">ajax Test Page!</div>
<br>
<input type="button" value="ajax실행" onclic="goAjax();">
</body>
</html>