使用AJAX自动更新

我目前正在我的网页上使用此代码：

invasions)) { echo "
Invasion Tracker
"; $i = 0; foreach($data->invasions as $title => $inv) { print "
District: {$title} 

Cog: {$inv->type} 

Progress: {$inv->progress} 
"; if (count(($data->invasions) > 1)) { if (end($data->invasions) !== $inv) { print "
"; } else { print "
"; } } } } else { echo "
No invasions!"; } ?> 

我希望通过AJAX每10秒刷新一次。 但是，我一直在读你需要创建一个函数，但我不确定我是如何使用API​​的呢？ 每10秒，该API正在更新，这就是为什么我希望每10秒使用AJAX更新一次。 目前，我有它，所以用户必须手动刷新。 任何帮助表示赞赏！

Answer 1

您只需使用此处提供的方法重新加载页面即可

但是，如果你想要一个AJAX实现，只是简单地介绍你的html的一部分很好，整洁，你将不得不

1. 几乎忘了你的PHP代码

2. 使用以下代码实现对url的请求

   $.ajax({ url: "https://www.toontownrewritten.com/api/invasions", }) .done(function( data ) { if ( console && console.log ) { console.log( data ); } });

3. 制作一个JS代码，将上一节中获得的data转换为可读的html并在页面上显示。 它应该在console.log(data)所在的块中实现。

4. 将该部分代码放在setInterval中

   setInterval(function(){ //$.ajax(); }, 10000);

5. 请注意，如果你的请求在这段时间内没有完成，你将会下地狱。 看到这个 。

Answer 2

我有一个更好的建议，再次与使用setInterval相同。

 setInterval(function () { if (isActive) return; // so that if any active ajax call is happening, don't go for one more ajax call isActive = true; try { $.ajax("URL", params,function() { isActive = false;//successcallback }, function () { isActive = false; // error callback }); } catch (ex) { isActive = false;} }, 10000); 

Answer 3

你的问题是无法理解AJAX。 下面是$.post()示例。

首先让我们创建您希望客户端（浏览器用户）看到的页面：

viewed.php

现在你需要在whatever.js你的JavaScript。

 $(function(){ function getData(){ $.post('whatever.php', function(data){ // var htm = do a bunch of stuff with the data Object, creating HTML $('#output').html(htm); }); } getData(); // don't need if PHP query takes place on original page load setInterval(getData, 10000); // query every 10 seconds }); 

在whatever.php ：

PHP生成的JSON显示在data参数中，回到创建PHP请求的JavaScript中：

 $.post('whatever.php', function(data){