Paint App,JQuery mobile – 对象没有方法

我真的很擅长编码。 我正在尝试制作适用于桌面和移动设备的绘图应用程序。 我使用JavaScript在桌面上工作正常,但是为了让它在移动设备上工作,似乎JQuery mobile是推荐的方法。 我正在将它转换为JQuery并让maint与.mousedown,.mouseup等一起工作但是当我改为.vmousedown,.vmouseup等以使其工作时触摸我得到一个错误,我不能似乎解决了。

未捕获的TypeError:对象[object Object]没有方法’vmousedown’

我见过其他有类似问题的人,但我很难让它适合我。

JSFiddle – http://jsfiddle.net/mquickel/dehAD/79/

HTML代码段

         

JS片段

  document.getElementById( "container" ).onmousedown = function(event){ event.preventDefault(); } var layer2 = document.getElementById("layer2"); var ctx2 = layer2.getContext("2d"); var imageObj = new Image(); /* Loading the Image*/ imageObj.onload = function() { ctx2.drawImage(imageObj, 0, 0); }; imageObj.src = 'https://lh5.googleusercontent.com/-P5ucC3TjCLU/UjHE0rENTaI/AAAAAAAAAts/mH2A_OORkQY/s800/color.png'; (function() { var canvas = document.getElementById('paint'); var ctx = canvas.getContext('2d'); var imageObj = new Image(); var cont = document.getElementById('container'); var mouse = {x: 0, y: 0}; var last_mouse = {x: 0, y: 0}; /* Mouse Capturing Work */ $(cont).mousemove (function(e) { last_mouse.x = mouse.x; last_mouse.y = mouse.y; mouse.x = e.pageX - this.offsetLeft; mouse.y = e.pageY - this.offsetTop; }); /* Drawing on Paint App */ ctx.lineWidth = 20; ctx.lineJoin = 'round'; ctx.lineCap = 'round'; ctx.strokeStyle = brushColor; $(cont).vmousedown(function(e) { console.log("hi"); $(cont).vmousemove (onPaint); }); $(cont).vmouseup (function() { console.log("up"); $(cont).unbind ('vmousemove', onPaint); }); var onPaint = function() { ctx.beginPath(); ctx.moveTo(last_mouse.x, last_mouse.y); ctx.lineTo(mouse.x, mouse.y); ctx.closePath(); ctx.stroke(); }; }());