如何讓此代碼適用於iPad等觸摸屏設備？

Question

我想拖動一個名爲moveMe的元素並將它放在窗口的任何位置。此代碼已經在使用臺式計算機的谷歌瀏覽器上正常工作。但是，當我在iPad中打開此文件時，它不起作用。我研究了ontouchstart，ontouchmove和ontouchend，並將其應用於此代碼，但仍然無效。請幫助我如何在不使用jQuery的情況下在iPad上運行此代碼，因爲iPad不擅長處理jQuery。如果有更有效的方法來做到這一點。

function init() { 
    movMeId=document.getElementById("moveMe"); 
    movMeId.style.left="900px"; 
    movMeId.style.top="500px"; 
    } 

document.onmousedown=coordinates; 
document.onmouseup=mouseup; 
function coordinates(e) { 
    if (!e) { 
    e = window.event; 
    } 
    var sender = (typeof(window.event) != "undefined") ? e.srcElement : e.target; 
    if (sender.id == "moveMe") { 
     mouseover=true; 
     pleft = parseInt(movMeId.style.left); 
     ptop = parseInt(movMeId.style.top); 
     xcoor = e.clientX; 
     ycoor = e.clientY; 
     document.onmousemove = moveImage; 
     return false; 
     } 
    else { 
     return false; 
     } 
    } 
function moveImage(e) { 
    if (!e) { 
     e = window.event;} 
     movMeId.style.left = pleft + e.clientX - xcoor + "px"; 
     movMeId.style.top = ptop + e.clientY - xcoor + "px"; 
     return false; 
    } 
function mouseup(e) { 
    document.onmousemove=null; 
    movMeId.style.left="900px"; 
    movMeId.style.top="500px"; 
    } 

Answer 1

您可能會發現這個答案關於HTML5拖放和有用的觸摸屏設備拖放API：HTML5 Drag and Drop API on Touch Screen Devices