我在 stackoverflow 的某个地方找到了这个函数，但我正在尝试扩展它来处理我的 Ipod 触摸的触摸事件。我认为通过添加三行代码应该很容易做到，但我认为有些东西我不明白。我的代码是：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
</head>
<body>
<div id="content-container">
<table>
<tr><td draggable="true" class="letter">a</td><td
class="letter" draggable="true">b</td><td class="letter"draggable="true">c</td></tr>
</table>
</div>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
//this just prevents screen from sliding around when touching it
addEventListener('touchmove', function(e) {
e.preventDefault();
}, true);
var draggedItem = null;
$('.letter').each(function(index){
$(this).on("dragstart", handleDragStart);
$(this).on("drop", handleDrop);
$(this).on("dragover", handleDragOver);
//I thought I could just add these 3 lines of code for it to work on touch screen devices
//$(this).on("ontouch", handleDragStart);
//$(this).on("touchend", handleDrop);
//$(this).on("touchmove", handleDragOver);
//please help with this part for touch screens
});
function handleDragStart(e){
draggedItem=this;
e.originalEvent.dataTransfer.setData('text/html', this.innerHTML);
}
function handleDragOver(e) {
if (e.preventDefault) {
e.preventDefault();
// Necessary. Allows us to drop.
}
return false;
}
function handleDrop(e){
if (e.stopPropagation) {
// e.stopPropagation();
// Stops some browsers from redirecting.
}
if (draggedItem != this ) {
//MH - swap if we're not dragging the item onto itself
var copy=$(this).clone(true,true);
$(this).replaceWith($(draggedItem).clone(true,true));
$(draggedItem).replaceWith($(copy).clone(true,true));
}
return false;
}
});
</script>
</body>
</html>
这个功能在电脑上很好用。我正在寻找的只是添加事件，使其在触摸屏设备上的工作方式相同。也许只做 onclick 会更容易，因为触摸屏可能很挑剔，但有人可以帮我创建一个交换功能来在我的 pod 上工作。