Question

所以我有一个代码，其中从文本文件中检索数字并通过HTML显示。

问题是，仅当我刷新页面时它才检索数字。如果我在另一页上更改号码，则在另一页上不会更改。

我以前也见过类似的问题，其中大多数都说要使用AJAX，但是我对AJAX的了解不多，我只需要这段代码，就好像我不会经常使用它一样。我想知道AJAX以外是否还有其他任何内容，如果只有AJAX，请提供代码示例。

PHP代码：

<?php
    $file = "num.txt"; //Path to your *.txt file
    $contents = file($file);
    $num = implode($contents);
?>

JavaScript代码。基本上，它获取PHP值并输出到html。

document.getElementById("num").innerHTML = '<?php echo $num; ?>';

请记住，我不想刷新页面。只是变量。

编辑： PHP代码-遇到错误-注意：未定义的索引：第3行C：\ xampp \ htdocs \ num.php中的keynum

这是PHP的代码

<?php
    $keynum = $_POST['keynum'];
    $post = "INSERT INTO post (keynum) VALUES ($keynum)";
    $fileLocation = getenv("DOCUMENT_ROOT") . "/num.txt";
    $file = fopen($fileLocation,"w");
    $content = $keynum;
    fwrite($file,$content);
    fclose($file);
    echo 'Response';
    die();
 ?>

Answer 1

您可以使用XMLHttpRequest来实现自己的目标，就像这样：

function updateData() {
  var xhttp = new XMLHttpRequest();
  
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById('num').innerHTML = this.responseText;
    }
  };      
  
  xhttp.open('GET', '/num.php', true);
  xhttp.send();
}

setInterval(updateData, 2000);

Answer 2

如果要刷新变量而不刷新页面，则需要使用异步请求。不必是AJAX，您可以使用本机XMLHttpRequest()函数。

如果您需要更多信息：https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests

Answer 3

或带有jQuery：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
    setInterval(function(){
        $.ajax({url:"num.php", success:function(result){
            $("#num").html(result);
        }});
    }, 3000);
</script>

<textarea id="num"></textarea>

Answer 4

像这样

let url = ""; //whatever url your requesting.

setInterval(function(){
    var x = new XMLHttpRequest();
    x.open("GET" , url , true);
    x.onreadystatechange = function(){
        if(x.readyState == 4 && x.status == 200)
        {
             document.getElementById("num").innerHTML = x.responseText;
        }
    }
    x.send();
} , 2000);

-更新，添加了帖子-

setInterval(function(){
        var x = new XMLHttpRequest();
        x.open("POST" , url , true);
        x.setRequestHeader("Content-Type" , "application/x-www-form-urlencoded");
        x.onreadystatechange = function(){
            if(x.readyState == 4 && x.status == 200)
            {
                 document.getElementById("num").innerHTML = x.responseText;
            }
        }
        x.send("postVar1=123");
    } , 2000);

Answer 5

get_nbr.php

 <?php
 $file = "num.txt"; //Path to your *.txt file
 $contents = file($file);
 $num = implode($contents);
 echo $num;
 ?>

index.php

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!---trigger get_nbr() on page load on an infinite loop every two seconds -->
<body onload="setInterval(get_nbr, 2000)">
<script>
  function get_nbr() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
  document.getElementById("num").innerHTML = this.responseText;
  }
  };
  xhttp.open("GET", "get_nbr.php", true);
  xhttp.send();
  }
 </script> 
<p id="num"></p>

每2秒重复执行PHP函数

5 个答案: