iPhone jQuery操作与拖放

Question

我正在努力实现以下目标。当用户将图标拖到html页面中的特定位置并保持它约3秒时，它必须自动创建一个新页面(如果没有页面)，否则转到下一页(或上一页)。

这是可以实现与jQuery吗?如果是，我该如何意识到?

我发现并尝试了以下解决方案:

使用Remy Sharp鼠标投放插件。在这个插件中，我可以使用timerinterval来计算如果我在一个特定的区域的时间量。

$(this).mousedown(function(interval))
{
}

但不知何故，我不明白这个工作与jQuery UI的拖放功能。我已经开发了一些代码与jQuery UI，但如果它是有用的?我真的不知道。

    $("#pickUpDiv").draggable({
    start: function () {
    },
    drag: function() {
        var timeOutPointer = -1;
        var focusElm       = $("#focusCenter");
        var leftTopPos     = focusElm.position();
        var height         = focusElm.height();
        var width          = focusElm.width();
        var rightBottomPos = {
            right:  leftTopPos.left + width,
            bottom: leftTopPos.top + height
        };
        var pos = $(this).position();
        if ((pos.left > leftTopPos.left && pos.top > leftTopPos.top) && (pos.left < rightBottomPos.right && pos.top < rightBottomPos.bottom)) {
            $(document).mousehold(function(timerInterval) {
                if (timerInterval == 30) {
                    createNewPage();
                } else {
                }
            });
        }
    },
    stop: function() {
    }
});

这是我的测试设置:

<div id="focusCenter" style="height: 200px; width: 200px; border: 1px solid black;">
</div>
<div id="pickUpDiv" style="height: 100px; width: 100px; background-color: red;">
    &nbsp;
</div>

我希望有人能帮我解决这个问题，或者至少给我指出正确的方向。:)已经提前谢谢你了

Answer 1

您可能需要绑定touchstart、touchmove和touchend事件

这里有一篇关于移动safari处理鼠标/触摸事件的文章:http://blogs.adobe.com/adobeandjquery/2011/03/07/the-current-state-of-touch-events/

编辑:

决定把我的评论编辑成我的回答:

我做了类似的事情。我所做的是，当鼠标进入一个对象时，我向该对象添加一个类，并设置一个超时，以查看该对象在n秒后是否仍然有一个类。在mouseout时移除类并删除计时器。如果解释不够，我将看看是否可以找到示例代码。我的功能是在树状结构中拖放"文件"，并在悬停和等待后展开文件夹。