我的程式碼一直在手機上無法執行 不知道有沒有哪位好心人可以給我一點建議呢?
<!--繪圖板-->
<!-- Canvas -->
<div><input type="image" src = "images/pencil.png" height = "30" id="pencil" onClick="write_text()"></input>
<input type="image" src = "images/eraser.png" height = "30"></input></div>
<div><canvas id="DrawingArea" width="900" height="1000" style="border: 2px solid gray"></canvas></div>
<!-- Canvas end -->
function write_text(){
var Drawing = document.getElementById("DrawingArea");
var ctx = Drawing.getContext("2d"); //取得繪製2d圖形的畫筆
var drawMode = false; //判斷是否正在繪圖
ctx.fillStyle = "white"; //整個canvas塗上白色背景避免PNG的透明底色效果
//Drawing點選、移動、放開按鍵事件時進行繪圖動作
Drawing.addEventListener("touchstart", function (e) {
var write_x = (e.clientX) - ($("#DrawingArea").position().left);
var write_y = (e.clientY) - ($("#DrawingArea").position().top);
ctx.beginPath(); //路徑開始
ctx.strokeStyle = "rgb(0,0,255)"; //設定筆填充的顏色
ctx.lineWidth = 5; //筆的粗細(單位是像素點)
ctx.moveTo(write_x, write_y); //繪圖點的起始座標
drawMode = true;
});
Drawing.addEventListener("touchmove", function (e) {
var write_x = (e.clientX) - ($("#DrawingArea").position().left);
var write_y = (e.clientY) - ($("#DrawingArea").position().top);
if (drawMode){
ctx.lineTo(write_x, write_y); //繪圖點的最終座標
ctx.stroke(); //執行繪圖
}
});
Drawing.addEventListener("touchend", function (e) {
drawMode = false;
ctx.closePath();
});
}