0

我在 PhoneGap 应用程序中创建基于拖放的菜单时遇到问题。我尝试了一些插件，例如 jquery.mobileraganddrop.js (http://www.stevefenton.co.uk/Content/Jquery-Mobile-Drag-And-Drop/) 没有工作并尝试自己编写此功能在 jquery mobile 上使用“触摸”事件（虽然动画并不流畅）。结果都不足以支持我的事业。

最终我找到了 pep.jquery.js (http://pep.briangonzalez.org/) 插件，它看起来很完美，但是出现了一些问题，我将在后面描述。

下面给出的代码背后的想法是菜单项显示为标记，这些标记均匀地围绕一个圆圈放置。每当将令牌放在圆心时，都会选择菜单选项。如果在触摸事件结束时令牌距离圆心不够近，则将其移回其原始位置。

问题是：拖动可以在 PC 上工作，但在Android手机上根本不起作用，当我停止拖动令牌时不会发生touchend事件（我知道 marginLeft 和 marginTop 设置为 0 并且赢了'不会导致令牌移动到原始位置 - 我将其留作调试目的）。

$(document).ready(function(){
    var centerX = 240;
    var centerY = 440;
    var radius = 180;
    var internalRadius = 86;    
    var tokenNumber = $("#circle .token").length;

    reloadTokens(tokenNumber, radius, 0);

    $(".token").pep({
        cssEaseDuration: 0,
        activeClass: "activeToken"
    });

    $("#token").bind("touchend",function(){
        $(this).forceStop();
        $(this).animate({
            marginLeft: 0,
            marginTop: 0
        }, "fast", "easein");
    });

});

function reloadTokens(tokenNumber, radius, additionalOffset){

    var degreeOffset = 60;

    var i = 0;
    $(".token").each(function(){
        degree = (i * (360/tokenNumber) - degreeOffset + additionalOffset) % 360;
        var tokenX = radius * Math.cos(degree * (Math.PI / 180)) + radius;
        var tokenY = radius * Math.sin(degree * (Math.PI / 180)) + radius;
        $(this).css({
            marginLeft: tokenX,
            marginTop: tokenY
        });
        i++;
    });
}

对此代码的任何帮助将不胜感激。:) 如果你给我另一个想法，我也会很高兴如何使用 phonegap 处理拖放，而不是我之前描述的方法。

4

1 回答 1

1

电影，

我创造了 Pep。哪个 Android 设备以及该设备上的哪个浏览器？给我更多信息，我会帮助调试。

如果您在此处提出问题，我们可以跟踪该错误，我将确保在此处交叉引用该问题，并且我们可以发布此问题的合法答案。

于 2012-05-13T19:40:28.040 回答