Question

我正在尝试使用查找偶数/奇数的示例来实现以下体系结构。我将客户端用作HTML文件，将Web服务器用作PHP。

[“ FindEO.html”]-HTML文件如下所示：

<!DOCTYPE html>
<html>

<body>
  <h3>Check Even/ODD Number</h3>
  <form method="get" action="http://192.168.0.103:81/DUNNO/eo.php">
    Enter number: <input type="text" name="fname">
    <input type="submit">
  </form>

</body>

</html>

[“ EO.php”]-PHP文件如下：

<?php
if ($_SERVER["REQUEST_METHOD"] == "GET") {
    $name = $_GET['fname'];
    $num = (int)$name;
    if (($num%2)==0) {
        echo "$name is Even";
    } else {
        echo "$name is Odd!";
    }   
} 
?>

执行 HTML 文件时，它要求输入以下内容：

点击提交按钮后。将显示 PHP 页面，而不显示 HTML 文件中的 PHP 页面的内容。

[当前显示（PHP文件）：]

[它应该在HTML文件中显示PHP内容]

因此，请求是从HTML文件发送到PHP服务器的，而不是从PHP文件发送响应到HTML文件，而是直接显示PHP文件本身。

1）是否可以显示预期的输出。（PHP处理HTML文件中的输出）？

2）假设我将当前的PHP代码存储在函数中：

<?php
function findeo($num){
    if (($num%2)==0) {
        echo "$name is Even";
    } else {
        echo "$name is Odd!";
    } 
}
if ($_SERVER["REQUEST_METHOD"] == "GET") {
    $name = $_GET['fname'];
    $num = (int)$name;
    findeo($num);
} 
?>

然后如何传递参数（10或任何数字到 $ num 变量）并调用 findeo（）函数 HTML 文件中的 PHP 页面？

请有人帮助我实现客户端-服务器体系结构，或者告诉我是否有其他方法可以使用 HTML 作为 client 和 PHP 作为服务器。

Answer 1

使用javascript将表单发送到php文件并获取答案。这是我应该做的：

  function getAnswer(e) {
    e.preventDefault();
    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'http://192.168.0.103:81/DUNNO/eo.php', true);
    xhr.responseType = 'text';

    xhr.onload = function () {
        if (xhr.readyState === xhr.DONE) {
            if (xhr.status === 200) {
                document.getElementById('answer').textContent = xhr.response;
            }
        }
    };
    
    xhr.onerror = function() {
      document.getElementById('answer').textContent = "Error...";
    }

    xhr.send(null);
  }

<!DOCTYPE html>
<html>

<body>
  <h3>Check Even/ODD Number</h3>
  <form method="get" onsubmit="getAnswer(event)">
    Enter number: <input type="text" name="fname">
    <input type="submit">
  </form>
  
  <div id="answer"></div>

</body>

</html>

使用preventDefault（）将阻止页面尝试提交表单，并允许javascript自行执行请求。另外，我在HTML中添加了一个div，该div将保留您的PHP文件给出的响应。

Answer 2

PHP在将页面内容提供给浏览器之后，无法修改页面的内容。但是，对于像jQuery这样的JavaScript库来说，这是微不足道的。或使用AJAX调用php脚本来更新元素。在StackOverFlow上有一些示例，例如：Change DIV content using ajax, php and jQuery

如何在HTML页面中检索PHP页面的内容？

2 个答案: