1. AJAX는 보다 대화형 애플리케이션을 만드는 데 사용됩니다.
2.ajax php 예제
다음 예는 사용자가 입력 상자에 들어갈 때 어떻게 수행되는지 보여줍니다. 웹 페이지는
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<script>
function showHint(str){
if (str.length==0){
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest){
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行的代码
xmlhttp=new XMLHttpRequest();
}else{
//IE6, IE5 浏览器执行的代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","gethint.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<p><b>在输入框中输入一个姓名:</b></p>
<form>
姓名: <input type="text" onkeyup="showHint(this.value)">
</form>
<p>返回值: <span id="txtHint"></span></p>
</body>
</html>에 문자를 입력할 때 웹 서버와 통신합니다. 입력 상자가 비어 있는 경우(str.length==0) 이 함수는 txtHint 자리 표시자의 내용을 지우고 함수를 종료합니다.
입력 상자가 비어 있지 않으면 showHint()는 다음 단계를 수행합니다.
XMLHttpRequest 객체 생성
서버 응답 시 실행할 함수 생성 준비됨
서버에 있는 파일에 요청 보내기
URL 끝에 추가된 매개변수(q)를 참고하세요(입력 상자의 내용 포함)
PHP 파일
위 단락 JavaScript를 통해 호출되는 서버 페이지는 "gethint.php"라는 이름의 PHP 파일입니다.
"gethint.php"의 소스 코드는 이름 배열을 확인한 후 해당 이름을 브라우저에 반환합니다.
gethint.php 소스 코드는 다음과 같습니다.
<?php
// 将姓名填充到数组中
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";
//从请求URL地址中获取 q 参数
$q=$_GET["q"];
//查找是否由匹配值， 如果 q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count($a); $i++)
{
if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
{
if ($hint=="")
{
$hint=$a[$i];
}
else
{
$hint=$hint." , ".$a[$i];
}
}
}
}
// 如果没有匹配值设置输出为 "no suggestion"
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}
//输出返回值
echo $response;
?> 설명: JavaScript가 텍스트(예: strlen($q) > 0)를 보내면 다음과 같은 일이 발생합니다.
JavaScript에서 보낸 문자와 일치하는 이름을 찾습니다.
일치하는 항목이 없는 경우 발견되면 "제안 없음"으로 설정된 문자열에 응답합니다.
일치하는 이름이 하나 이상 발견되면 모든 이름이 포함된 응답 문자열을 설정합니다.
"txtHint" 자리 표시자에 응답 보내기
다음 섹션