ajaxは配列を渡す2つのphpを実装します

近年、インターネット技術の急速な発展に伴い、ユーザー エクスペリエンスを向上させるために Ajax を使用する Web サイトが増えています。この記事では、Ajaxを介して2つのphpファイル間の配列転送を実装する方法を紹介します。

1. Ajax とは

Ajax (Asynchronous JavaScript and XML)、つまり非同期 JavaScript と XML は、高速で動的 Web ページを作成するために使用されるテクノロジーです。 Ajax を使用すると、バックグラウンドでサーバーと少量のデータを交換することで、Web ページを非同期に更新できます。これは、ページ全体を再読み込みしなくても、ページの一部を更新できることを意味します。これにより、ページの応答速度が向上し、ユーザー エクスペリエンスが向上します。

2. 配列とは

配列は変数の順序付けられたセットであり、文字列、数値、オブジェクトなどの任意のデータ型を使用できます。配列には複数の値を格納でき、各値には一意のインデックスを介してアクセスできます。

3. Ajax を使用して配列を送信する

ステップ 1: 配列の送信用 (send.php) と配列の受信用 (receive.php) の 2 つの 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 を使用して 2 つの 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 は、Web ページの応答速度を向上させるだけでなく、ユーザー エクスペリエンスを最適化することもできます。この記事を学ぶことで、誰もが Ajax と配列伝送についての理解と応用知識をさらに深めることができると思います。

以上がajaxは配列を渡す2つのphpを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。