Javascript 如何在XHR调用中使用响应PHP变量？_Javascript_Php_Ajax_Xmlhttprequest

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

javascript php ajax

Javascript 如何在XHR调用中使用响应PHP变量？,javascript,php,ajax,xmlhttprequest,Javascript,Php,Ajax,Xmlhttprequest,我有两个页面，分别是page1.php和page2.php。在page1.php中，我有一个按钮，当单击它时，它会对page2.php进行XHR调用，并以定义的除法显示响应，即page1中的“print” page1.php的代码 <html> <button type="button" onclick="randomFunction()">Request data</button> <div id="print"></div

我有两个页面，分别是page1.php和page2.php。在page1.php中，我有一个按钮，当单击它时，它会对page2.php进行XHR调用，并以定义的除法显示响应，即page1中的“print”

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>


请求数据
函数随机化函数（）
{
var-xmlhttp；
if（window.XMLHttpRequest）
{//IE7+、Firefox、Chrome、Opera、Safari的代码
xmlhttp=新的XMLHttpRequest（）；
}
其他的
{//IE6、IE5的代码
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
xmlhttp.onreadystatechange=函数（）
{
if（xmlhttp.readyState==4&&xmlhttp.status==200）
{
document.getElementById（“print”）.innerHTML=xmlhttp.responseText；
}
}
open（“POST”，“page2.php”，true）；
xmlhttp.send（）；
}

page2.php的代码

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

我现在得到的输出

我想操纵我从第2页得到的反应。如中所示，我想在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

发回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>

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

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

<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>

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

page2.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>

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

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

<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>

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

为什么不使用

page2.php

中的CSS类？例如：

echo'.$a'我能做到。但根据实际情况，我不允许在page2.php中添加css。我必须在page1.php中进行操作。您是否可以发送回JSON，然后可以轻松地获得不同的值。然后在page1.php
中添加样式。如何捕获JSON值？假设，我将page2.php更改为echo json_encode（$a.$b）
我可以在PHP中而不是在JS中使用此响应数据吗？我已经在我的帖子中添加了PHP示例。但您不能再在PHP中使用JS变量了。PHP执行在JS启动之前结束。只有当您发出另一个AJAX请求，将收到的JSON发送给它并用HTML响应时，这才有效。但是这不是必需的，因为您可以在page2.php
中使用HTML进行响应。实际上，我想在php中使用响应数据。因为，在设计中会有很多操作。如何做到这一点？您不能再在PHP中直接使用这些数据了。PHP已经结束了它的执行。正如我所说，唯一的方法是用新的AJAX请求发送您的响应，并在那个里使用数据。在那之后，用被操纵的设计来回应。这是唯一的办法。为什么不在page1.php中进行设计，并通过发出AJAX请求获取数据呢。然后把它添加到正确的地方。我的答案对你来说够了吗？