Javascript 在不刷新页面的情况下更新画布元素

Javascript 在不刷新页面的情况下更新画布元素,javascript,php,mysql,html5-canvas,Javascript,Php,Mysql,Html5 Canvas,我有一个问题,我一直在尝试一切,但就是解决不了。我已经将HTML5画布设置为将坐标、对象等发送到数据库,然后当该画布重新加载时,页面刷新将使用正确的坐标重新加载所有对象。然而,我试图实现的是画布每x秒更新一次而不刷新页面,以显示更改等。例如,其他人向画布添加了一些内容,每个人都会看到更改而不刷新页面,所以所有用户都看到相同的内容 提前谢谢你的帮助 好的,我在这篇文章中添加了一个简单的代码示例,这是我问题的一个简单代码示例,在我放入的警报中显示时,这一切都很好,var甚至更新得很好,但是画布现在确

我有一个问题,我一直在尝试一切,但就是解决不了。我已经将HTML5画布设置为将坐标、对象等发送到数据库,然后当该画布重新加载时,页面刷新将使用正确的坐标重新加载所有对象。然而,我试图实现的是画布每x秒更新一次而不刷新页面,以显示更改等。例如,其他人向画布添加了一些内容,每个人都会看到更改而不刷新页面,所以所有用户都看到相同的内容

提前谢谢你的帮助

好的,我在这篇文章中添加了一个简单的代码示例,这是我问题的一个简单代码示例,在我放入的警报中显示时,这一切都很好,var甚至更新得很好,但是画布现在确实显示了下面的更改?php文件所做的只是回显“我来自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>`

当警报显示var正在从getvars.php更新时,我是否需要添加一些内容来进行画布更新?当我更改它时,画布保持不变?啊,快把我逼疯了!提前感谢您可能提供的任何帮助?

如果您希望您的用户能够实时协作,您需要某种方式在客户端和服务器之间进行实时通信

有不同的技术来实现这一点

一个是,也称为AJAX。您可以使用它定期轮询服务器,以检查其他客户端是否绘制了某些内容,然后在本地画布上重复其绘制操作

另一种是允许服务器将从一个客户端接收到的消息实时广播给其他客户端


两者都需要服务器端编程。

在jquery ajax调用中将绘图代码放入.done处理程序。

只需共享代码…………您应该按照@Goikiu的建议使用ajax。使用ajax发出请求,并解析响应以相应地更新画布抽屉。是另一种方式,在本例中可能是比ajax更好的解决方案,因为事件是从服务器发送到客户端的,而不是从另一种方式。好的,我举了一个简单的例子来说明这个问题,它都可以工作,甚至可以通过我输入的警报正确更新变量,但画布不更新?我已经用代码示例更新了上面的问题,我不明白,我需要把它放在哪里?我想一切都正常,我只需要告诉画布使用新的greg变量进行更新?是的,这就是.done回调的作用。当您使用$.ajax进行ajax调用时,jquery将在成功接收到响应后在.done中执行代码。看看它是如何工作的:祝你的项目好运!太好了,现在一切都好了,我是新来的。我需要现在关闭这个帖子吗?我找不到关闭按钮?很高兴你把它整理好了。不,在你的职位上没有其他要求,只是享受你的成功。干杯