Javascript 为什么可以'；我不能在HTML5画布上触摸画一个正方形吗？

我试图用html5、js和touch事件绘制一个正方形，但当我尝试在画布上绘制时，什么都没有显示。我做错了什么

---

这是我的密码

Javascript:

---

HTML5：

---

方格

---

我的代码出了什么问题？

可能是两个函数在一起，导致了某种解释错误，因为我的错误控制台说它找不到函数square（）

---

我通过将变量移到外部并分离这两个函数对其进行了一些编辑…

实际上，我复制并粘贴了您的代码，并对其进行了测试。在我的Android手机上，它似乎工作正常。

你试过什么？那没用。我需要真正的帮助。。。就像一个教程，而不是一个关于如何制定问题的讲座，哈哈。我想我的问题已经很清楚了。拜托，有人能帮我弄清楚吗？谢谢。你的代码看起来不错；你能用你的代码设置并共享一个非工作的文件吗？我刚刚把你的代码复制并粘贴到一个HTML文档中，效果很好。我认为您需要提供更多的上下文。您正在使用移动浏览器进行测试吗？“touchstart”在桌面浏览器上不起作用。在我的Android手机上，你的代码似乎工作得很好。在这种情况下，避免使用函数中的函数几乎肯定是一个好的设计决策，但它似乎并没有破坏他的代码。有关所有代码都位于

square（）

中的功能版本，请参阅。（或者这会破坏你的浏览器吗？也许这是一个跨平台的问题。）也许他的代码正在工作，他在页面上有其他东西破坏了脚本。。。正方形（）；可能是JSFIDLE中的X-Compat问题。。。我想他应该再次检查他的整个页面……我尝试了两个建议的JSFIDLE网站，但在这两个网站上，当我尝试绘制它时，正方形仍然没有出现：（它在你的电脑上工作吗？你必须在支持触摸的设备上试用它，因为正方形只是在触摸上绘制的。uuo，那么一切都好了吗？我的代码在触摸设备上工作得很好？第二个

var can

是第一个的副本-看起来没有多大意义。@Chuck，你是对的。事实上，我试过原始的posters编码，无法重现问题。我收回了答案。

function square()
{   
    var can = document.getElementById('canvasSignature');
var ctx = can.getContext('2d');


can.addEventListener( 'touchstart', onTouchStart, false);

function onTouchStart(e) {
 ctx.fillRect(0,0,300,300);   

}
}

<div id="canvasDiv">
    <canvas id="canvasSignature" width="580px" height="788px" style="border:2px solid #000; background: #FFF;"></canvas>
</div>

<div id="Square">  
    <p><button onclick="square();">Square</button></p>
</div>