Ajax는 두 개의 PHP 전달 배열을 구현합니다.

최근에는 인터넷 기술의 급속한 발전으로 사용자 경험을 향상시키기 위해 Ajax를 사용하는 웹사이트가 점점 더 많아지고 있습니다. 이 기사에서는 Ajax를 통해 두 PHP 파일 간의 배열 전송을 구현하는 방법을 소개합니다.

1. Ajax란

Ajax(Asynchronous JavaScript and XML), 즉 비동기 JavaScript 및 XML은 빠르고 동적인 웹 페이지를 만드는 데 사용되는 기술입니다. Ajax를 사용하면 백그라운드에서 서버와 소량의 데이터를 교환하여 웹 페이지를 비동기적으로 업데이트할 수 있습니다. 이는 전체 페이지를 다시 로드하지 않고도 페이지의 일부를 업데이트할 수 있음을 의미합니다. 이를 통해 페이지의 응답 속도가 향상되고 사용자 경험이 향상될 수 있습니다.

2. 배열이란 무엇입니까

배열은 문자열, 숫자, 객체 등을 포함한 모든 데이터 유형이 될 수 있는 순서가 지정된 변수 집합입니다. 배열은 여러 값을 저장할 수 있으며 각 값은 고유 인덱스를 통해 액세스할 수 있습니다.

3. Ajax를 사용하여 배열 전송

1단계: 두 개의 PHP 파일을 만듭니다. 하나는 배열 전송용(send.php)이고 다른 하나는 배열 수신용(receive.php)입니다.

send.php 파일 코드:

<?php
$array = array("name" => "Tom", "age" => "25", "gender" => "male");
echo json_encode($array);
?>

receive.php 파일 코드:

<?php
$data = $_POST['data'];
$array = json_decode($data, true);
echo "姓名：" . $array['name'] . "<br>";
echo "年龄：" . $array['age'] . "<br>";
echo "性别：" . $array['gender'] . "<br>";
?>

2단계: XMLHttpRequest 객체를 사용하여 Ajax 요청을 생성합니다.

var xhr = new XMLHttpRequest();

3단계: open() 메서드를 사용하여 요청을 엽니다.

xhr.open("POST", "receive.php", true);

4단계: HTTP 요청 헤더를 설정합니다.

xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

5단계: 서버가 응답할 때 적절한 작업을 수행하도록 onreadystatechange 이벤트 핸들러를 설정합니다.

xhr.onreadystatechange = function() {
   if (xhr.readyState == 4 && xhr.status == 200) {
        document.getElementById("result").innerHTML = xhr.responseText;
   }
};

6단계: 전송할 데이터를 URL 형식으로 인코딩합니다.

var data = "data=" + encodeURIComponent(JSON.stringify(array));

7단계: 요청 보내기.

xhr.send(data);

4. 실제 적용

다음은 Ajax를 사용하여 두 PHP 파일 간에 배열을 전송하는 방법을 보여주는 구체적인 예입니다. 사용자가 이름, 나이, 성별 및 기타 정보를 입력한 후 양식을 제출하는 양식이 있다고 가정해 보겠습니다. 이 정보는 Ajax를 통해 send.php 파일로 전송되고, receive.php 파일로 반환되어 최종적으로 표시됩니다.

코드는 다음과 같습니다.

<script>
   function sendArray() {
      var array = {};
      array['name'] = document.getElementById('name').value;
      array['age'] = document.getElementById('age').value;
      array['gender'] = document.getElementById('gender').value;

      var xhr = new XMLHttpRequest();
      xhr.open(&quot;POST&quot;, &quot;receive.php&quot;, true);
      xhr.setRequestHeader(&quot;Content-Type&quot;, &quot;application/x-www-form-urlencoded&quot;);
      xhr.onreadystatechange = function() {
         if (xhr.readyState == 4 && xhr.status == 200) {
            document.getElementById("result").innerHTML = xhr.responseText;
         }
      };
      var data = &quot;data=&quot; + encodeURIComponent(JSON.stringify(array));
      xhr.send(data);
   }
</script>


   

      姓名：

      年龄：

      性别：
         男
         女
      

      
   
   

receive.php 파일 코드:

<?php
$data = $_POST['data'];
$array = json_decode($data, true);
echo "姓名：" . $array['name'] . "<br>";
echo "年龄：" . $array['age'] . "<br>";
echo "性别：" . $array['gender'] . "<br>";
?>

5. 요약

이 기사에서는 Ajax를 사용하여 배열을 전송하는 방법을 소개하고 구체적인 구현 프로세스를 실제 예제를 통해 보여줍니다. Ajax는 웹페이지의 응답 속도를 향상시킬 뿐만 아니라 사용자 경험도 최적화합니다. 이 글을 공부함으로써 모든 사람이 Ajax와 배열 전송에 대한 더 깊은 이해와 응용 지식을 갖게 될 것이라고 믿습니다.

위 내용은 Ajax는 두 개의 PHP 전달 배열을 구현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!