我有一个问题,我已经尝试了一切,但就是无法解决。我已经将 HTML5 Canvas 设置为将坐标、对象等发送到数据库,然后当重新加载该 Canvas (页面刷新)时,它会使用正确的坐标重新加载所有对象。 .但是我想要实现的是 Canvas 更新而无需每x秒刷新一次页面以显示更改等,例如其他人向 Canvas 添加了一些内容,每个人都会在没有页面刷新的情况下看到更改,因此所有用户都看到相同的东西?
预先感谢您提供任何帮助?
好的,我添加到这篇文章中,这是我的问题的一个简单代码示例,这一切都工作正常,并且在我放入的警报中显示时,变量甚至更新得很好,但是 Canvas 现在确实显示了下面的更改? getvars.php 文件所做的所有事情就是 echo '我来自 getvars 脚本!';
`<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body{ margin:10px; background:#666; }
#my_canvas{ background:#FFF; border:#000 1px solid; }
</style>
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script>
$(function() {getStatus();});
function getStatus() {
greg = $.ajax({
url: "getvars.php",
async: false
}).responseText;
setTimeout("getStatus()",10000);
function draw(){
var ctx = document.getElementById('my_canvas').getContext('2d');
ctx.fillStyle = 'black';
ctx.font = 'italic bold 60px Arial, sans-serif';
ctx.fillText(greg, 50, 50, 300);}
window.alert(greg)
window.onload = draw;}
</script>
</head>
<body>
<canvas id="my_canvas" width="500" height="350"></canvas>
</body>
</html>`
是否需要添加一些内容来使 Canvas 更新,因为警报显示 var 正在从 getvars.php 进行更新,当我更改它时, Canvas 保持不变?啊,这让我发疯了!预先感谢您可以提供的任何帮助?
最佳答案
将绘图代码放入 jquery ajax 调用的 .done 处理程序中。
关于javascript - 更新 Canvas 元素而不刷新页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20840262/