如何在移动设备上实现拖动事件

Question

拖动事件正在桌面上运行，但同样不适用于移动设备。

我正在使用dragstart和dragend个事件。

<div><a id="newTask" title="Add new task" draggable="true" ondragstart=getId(this.id) touchstart="getId(this.Id)" ondragend="createShape(event)" touchend="createShape(event)"><img src="images/task.png" /></a></div>

在拖动结束createShape()上调用函数，使用jointjs创建svg形状：

function createShape(event)
{
    var $stageContainer = $("#canvas");
    var stageOffset = $stageContainer.offset();
    clientX = event.clientX;
    clientY = event.clientY;
    offsetX = stageOffset.left;
    offsetY = stageOffset.top;
    x = clientX - offsetX;
    y = clientY - offsetY;

    switch (shapeId)
    {
        case('newTask'):
            createRect(x, y);
            break;
        default:
            console.log("Nothing to drag");
    }
}

function createRect(x, y)
{
    var rect = new joint.shapes.devs.TooledModel({
        position: {x: x, y: y},
        size: {width: 120, height: 85},
        inPorts: [''],
        outPorts: [''],
        attrs: {
            text: {text: 'Edit me', fill: 'black'},
            rect: {
                fill: '#D6F2FC', rx: 7, ry: 15, opacity: .80, 'stroke-width': 2
            },
            '.inPorts circle': {type: 'input'},
            '.outPorts circle': {type: 'output'},
            '.port-body': {r: 3}
        }
    });
    graph.addCell(rect);
}

对于移动设备，我尝试了touchstart和touchend事件，但它无效。