如何在 XHR 调用中使用响应 PHP 变量？答案

【问题标题】：How to use the response PHP variables in a XHR call?如何在 XHR 调用中使用响应 PHP 变量？
【发布时间】：2015-05-28 06:05:43
【问题描述】：

我有两个页面，page1.php 和 page2.php。在 page1.php 中我有一个按钮，当单击它时，它会调用 page2.php 并在定义的部分中显示响应，即 page1 中的“打印”。

page1.php 的代码

<html>
    <button type="button" onclick="randomFunction()">Request data</button>
    <div id="print"></div>
    <script type="text/javascript">
        function randomFunction()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
          {
          document.getElementById("print").innerHTML=xmlhttp.responseText;
          }
        }
        xmlhttp.open("POST","page2.php",true);
        xmlhttp.send();
        }
    </script>
</html>

page2.php 的代码

<?php
$a = "apple";
$b = "banana";
echo $a;
echo $b;
?>

我现在得到的输出，http://imgur.com/tyqEOgW

我想处理从 page2 获得的响应。如我想在 page1.php 上以红色显示“苹果”和以蓝色显示“香蕉”

我该怎么做？

【问题讨论】：

你为什么不用 page2.php 的 CSS 类 echoing？例如：echo '<span class="red-apple">'.$a.'</span>';
我能做到。但是根据实际情况，不允许在page2.php中添加css。我必须在 page1.php 中进行操作。
您能否发回 JSON，然后您可以轻松获得不同的值。然后在page1.php 中添加样式。
如何捕获 JSON 值？假设，我将 page2.php 更改为 echo json_encode($a . $b);

标签： javascript php ajax xmlhttprequest

【解决方案1】：

从page2.php 发回 JSON，然后将包含该数据的自定义 HTML 添加到 page1.php。

page1.php

<html>
    <button type="button" onclick="randomFunction()">Request data</button>
    <div id="print"></div>
    <script type="text/javascript">
        function randomFunction()
        {
          var xmlhttp;
          if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
          }
          else
          {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }

          xmlhttp.onreadystatechange=function()
          {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
              var data = JSON.parse(xmlhttp.responseText);
              var html = '<span class="apple">'+data.a+'</span><span class="banana">'+data.b+'</span>';

              document.getElementById("print").innerHTML = html;
            }
          }

          xmlhttp.open("POST","page2.php",true);
          xmlhttp.send();
        }
    </script>
</html>

page2.php

<?php
  $a = "apple";
  $b = "banana";

  echo json_encode( array( 'a' => $a, 'b' => $b ) );
?>

现在您可以随意设置这些spans 的样式。当然，您可以根据需要编辑 HTML 结构。

仅限 PHP

page1.php

<html>
    <a href="?showData=1">Request data</a>
    <div id="print">
        <?php
        // Show data only, if our link was clicked
        if( $_GET['showData'] == 1 ){
            // Get page2.php
            require_once('page2.php');

            echo '<span class="apple">'.$a.'</span><span class="banana">'.$b.'</span>';
        }
        ?>
    </div>
</html>

page2.php

<?php
  $a = "apple";
  $b = "banana";
?>

【讨论】：

我可以在 PHP 而不是 JS 中使用这个响应数据吗？
我在我的帖子中添加了 PHP 示例。但是你不能再在 PHP 中使用 JS 变量了。 PHP 执行在 JS 启动之前结束。这只有在您发出另一个 AJAX 请求、将收到的 JSON 发送给它并使用 HTML 响应时才有效。但这不是必需的，因为您可以在 page2.php 中使用 HTML 进行响应。
其实我想在PHP中使用响应数据。因为，设计中会有很多操作。该怎么做？
你不能再直接在 PHP 中使用这些数据了。 PHP 已经结束了它的执行。就像我说的，唯一的方法是用新的 AJAX 请求发回您的响应并在那里使用数据。在那之后，用操纵的设计来回应。这是唯一的方法。您为什么不在page1.php 中进行设计并通过发出AJAX 请求为其获取数据。然后只需将其添加到正确的位置。
我的回答够吗？