PHP - AJAX 대 PHP

AJAX 서버가 없습니다.

AJAX는 브라우저에서 실행되는 기술입니다. 브라우저와 웹 서버 간의 비동기 데이터 전송을 사용하므로 웹 페이지가 전체 페이지 대신 서버에서 소량의 정보를 요청할 수 있습니다.

AJAX는 웹 서버 소프트웨어와 독립적인 웹 브라우저 기술입니다.

AJAX PHP 예제

다음 예제는 사용자가 문자를 입력할 때 웹페이지가 어떻게 동작하는지 보여줍니다. 웹 서버와 통신:

인스턴스

위 입력창에 사용자가 문자를 입력하면 "showHint()" 함수가 실행됩니다. 이 함수는 "onkeyup" 이벤트에 의해 실행됩니다:

<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>PHP中文网(php.cn)</title>
     <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","ajax_php.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)에 주의하세요(입력 내용 포함) box)

위 문단 통과 JavaScript로 호출되는 서버 페이지는 "ajax_php.php"라는 이름의 PHP 파일입니다.

"ajax_php.php"의 소스 코드는 이름 배열을 확인하고 해당 이름을 브라우저에 반환합니다.

ajax_php.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)를 보내면 다음과 같은 일이 발생합니다:

1 .JavaScript에서 보낸 문자와 일치하는 이름을 찾습니다

2. 일치하는 항목이 없으면 응답 문자열을 "제안 없음"으로 설정합니다

3. 그런 다음 모든 이름으로 응답 문자열 설정

4. "txtHint" 자리 표시자에 응답 보내기

PHP Ajax 교차 도메인 문제 해결 방법

비동기 요청이 도메인 간을 수행해야 하는 경우 PHP Ajax 도메인 간 문제 해결 방법을 확인해 보세요.

지속적인 학습

새로운 파일

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PHP中文网(php.cn)</title> <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","ajax_php.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>

제출하다 코드 재설정

자동운전