javascript - 从 PHP 回显获取文本并使用 AJAX 更新 DIV

Question

我在攻读学位期间学习 HTML、PHP、AJAX 和 jQuery。在实践中，我需要每 3 秒刷新一个 DIV 容器，而不需要为整个页面充电。

我必须使用 AJAX 来刷新并且响应需要是使用 PHP 在服务器中生成的随机数。

我有这个:

index.php

<div id="contador">NEED TO OVERWRITE THIS TEXT</div>

number.php

<?php
    echo "Number: " . rand(1,100);
?>

ajaxreload.js

function update() {
  $("#contador").load('Loading...'); 
  $.ajax({
    type: 'GET',
    url: 'number.php',
    timeout: 3000,
    success: function(data) {
      $("#contador").html(data);
      $("#contador").html(''); 
      window.setTimeout(update, 3000);
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
      $("#contador").html('Timeout...');
      window.setTimeout(update, 3000);
    }
});
}
$(document).ready(function() {
    update();
});

DIV 每 3 秒更新一次，但它没有从 number.php 获得回显响应。我收到一条非常快的“正在加载...”消息，然后是“超时...”。怎么了？我需要用别的东西代替 echo 吗？另一种类型或 URL 数据？另一个 AJAX 函数？

谢谢!

已解决:谢谢!在控制台中解决 :) 问题是我的 index.php 文件在根目录中，而 number.php 和 ajaxreload.js 在“脚本”文件夹中。参数 url: 'number.php' 尝试从 div 位置(index.php 所在的位置)而不是脚本文件调用的位置加载它

谢谢@dan08 @Keith Chason第一次使用控制台

Answer 1

我现在没有可以测试它的环境，但我怀疑 window.setTimeout(update, 3000); 不是你想要做的。

$.ajax 函数的timeout 参数是请求允许的时间量，而不是它运行的时间间隔。

http://www.tutorialsteacher.com/jquery/jquery-ajax-method

如果你想让它每 3 秒加载一次，我会使用 Javascript 中的 setInterval 函数:

https://www.w3schools.com/jsref/met_win_setinterval.asp

function update() {
  $("#contador").load('Loading...'); 
  $.ajax({
    type: 'GET',
    url: 'number.php',
    success: function(data) {
      $("#contador").html(data);
      //$("#contador").html(''); This clears your <div>
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
      $("#contador").html('Timeout...');
      console.log('TextStatus: '+textStatus);
      console.log('ErrorThrown: ' + errorThrown);
    }
});
}
$(document).ready(function() {
    setInterval(update, 3000);
});