반응형
모든 파일은 utf-8로 작성되었습니다.
index.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="example.js"></script>
</head>
<body>
<div id="head"> hello, guest!</div>
<input type="text" id="name" value="" onkeyup="change()"/>
</body>
</html>
example.js
//XmlHttpRequest 객체 생성
if (typeof ActiveXObject != 'undefined')
{
XMLHttpRequest = function ()
{
return new ActiveXObject(navigator.userAgent.indexOf('MSIE 5') >-1 ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP');
};
}
var xhr = new XMLHttpRequest();
// 객체 생성하고 함수 생성
function change()
{
var name = document.getElementById("name").value;
var url = "exam.php?name="+name;
xhr.open("Get",url,true);
xhr.onreadystatechange = callback;
xhr.send();
}
function callback()
{
if (xhr.readyState == 4)
{
if (xhr.status == 200)
{
var txt = xhr.responseText;
document.getElementById('head').innerHTML = txt;
}
}
}
exam.php :
<?php
header("Content-Type: text/html; charset=UTF-8");
$name = $_REQUEST["name"];
echo "welcome ".$name."!!";
?>
[이미지 출처 : http://compstat.chonbuk.ac.kr/JavaScript/]
참고사이트 http://compstat.chonbuk.ac.kr/JavaScript/
index.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="example.js"></script>
</head>
<body>
<div id="head"> hello, guest!</div>
<input type="text" id="name" value="" onkeyup="change()"/>
</body>
</html>
example.js
//XmlHttpRequest 객체 생성
if (typeof ActiveXObject != 'undefined')
{
XMLHttpRequest = function ()
{
return new ActiveXObject(navigator.userAgent.indexOf('MSIE 5') >-1 ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP');
};
}
var xhr = new XMLHttpRequest();
// 객체 생성하고 함수 생성
function change()
{
var name = document.getElementById("name").value;
var url = "exam.php?name="+name;
xhr.open("Get",url,true);
xhr.onreadystatechange = callback;
xhr.send();
}
function callback()
{
if (xhr.readyState == 4)
{
if (xhr.status == 200)
{
var txt = xhr.responseText;
document.getElementById('head').innerHTML = txt;
}
}
}
exam.php :
<?php
header("Content-Type: text/html; charset=UTF-8");
$name = $_REQUEST["name"];
echo "welcome ".$name."!!";
?>
[이미지 출처 : http://compstat.chonbuk.ac.kr/JavaScript/]
참고사이트 http://compstat.chonbuk.ac.kr/JavaScript/
반응형
'Programing > javascript' 카테고리의 다른 글
jquery 자식창에서 부모창으로 값 전달. (0) | 2011.02.08 |
---|---|
jquery 핸들링 1 [Table 핸들링][펌] (0) | 2010.08.30 |
jquery input의 value 값 알아오기 (1) | 2010.04.12 |
문자열 잘라서 배열에 넣기 (0) | 2010.03.31 |
javascript opener 오류 "엑세스가 거부 되었습니다." (2) | 2010.03.26 |
iframe height 자동 리사이징 (1) | 2010.01.22 |
javascript onload (0) | 2009.12.10 |
지정된 영역안의 내용만 프린트 출력 (1) | 2009.06.03 |