<html>
<head>
<meta?charset=utf-8>
<title>canvas?test</title>
<script?src="jquery_1_7.js"></script>
<style?type="text/css">
#php100
{border:1px?solid?#ccc;}
</style>
</head>
<body>
<canvas?id="php100"?width="500"?height="500"?></canvas>
<script?type="text/javascript">
var?c=document.getElementById("php100");
var?p100=c.getContext("2d");
p100.lineWidth=5;
p100.strokeStyle="red";
paint=0;
$("#php100").mousedown(function(e){
var?mouseX=e.pageX-this.offsetLeft;
var?mouseY=e.pageY-this.offsetTop;
paint=1;
p100.moveTo(mouseX,mouseY);//起始位置
});
$("#php100").mouseup(function(e){
paint=0;});
$("#php100").mousemove(function(e){
var?mouseX=e.pageX-this.offsetLeft;
var?mouseY=e.pageY-this.offsetTop;
if(paint){ p100.lineTo(mouseX,mouseY);//終止位置 p100.stroke();//結束圖形 }});
</script>
</body>
</html>
<!--妳的錯誤都是小問題，若幫到妳,望采納!-->