javascript - Android + jQuery - swipeleft 上的第二个不会执行

Question

我必须为我的网页做一些特殊的事情才能在 Android 上以正确的方式工作。显示一些图像(一个可见，另一个不可见)，并且通过滑动应该可以更改它们。到目前为止，在所有操作系统上都没有问题。

但它也应该可以缩放。现在Android开始有Buggy了。由于滑动回调，它会停止缩放手势。回调本身不会更改页面，因为 View 已缩放，因此不应有中断。

现在，我的工作方式是在两根手指触摸显示屏时关闭向左滑动和向右滑动，如果手指离开显示屏则重新打开。

第一次运行时，我可以滑动，然后可以不间断地缩放，但之后我就无法再滑动了。再次调用重新设置回调的函数，它设置了回调，但它们不会被执行...

代码如下:

app.utils.scroll = (function(){
var $viewport     = undefined;
var swipeDisabled = false;

var init = function(){
    $viewport = $('#viewport');

    $viewport.mousewheel(mayChangePage);

    // On touchstart with two fingers, remove the swipe listeners.
    $viewport.on('touchstart', function (e) {
        if (e.originalEvent.touches.length > 1) {
            removeSwipe();
            swipeDisabled = true;
        }
    });

    // On touchend, re-define the swipe listeners, if they where removed through two-finger-gesture.
    $viewport.on('touchend', function (e) {
        if (swipeDisabled === true) {
            swipeDisabled = false;
            initSwipe();
        }
    });

    initSwipe();
}
var mayChangePage = function(e){
    // If page is not zoomed, change page (next or prev).
    if (app.utils.zoom.isZoomed() === false) {
        if (e.deltaY > 0) {
            app.utils.pagination.prev(e);
        } else {
            app.utils.pagination.next(e);
        }
    }

    // Stop scrolling page through mouse wheel.
    e.preventDefault();
    e.stopPropagation();
};
var next = function (e) {
    // If page is not zoomed, switch to next page.
    if (app.utils.zoom.isZoomed() === false) {
        app.utils.pagination.next(e);
    }
};
var prev = function (e) {
    // If page is not zoomed, switch to prev page.
    if (app.utils.zoom.isZoomed() === false) {
        app.utils.pagination.prev(e);
    }
};
var initSwipe = function () {
    // Listen to swipeleft / swiperight-Event to change page.
    $viewport.on('swipeleft.next', next);
    $viewport.on('swiperight.prev', prev);
};
var removeSwipe = function () {
    // Remove listen to swipeleft / swiperight-Event for changing page to prevent android-bug.
    $viewport.off('swipeleft.next');
    $viewport.off('swiperight.prev');
};

$(document).ready(init);
}());

Pastebin

有什么想法可以让 Activity 重新开始吗？

感谢所有的想法。

问候利波利夫

Answer 1

已修复:

jQuery Mobile 本身 prevents the swipe Event如果注册了处理程序，则终止“滚动”。

因此，我覆盖了 $.event.special.swipe.scrollSupressionThreshold 值并将其设置为 10000，以防止 jQueryMobile 的 PreventDefault-call:

$.event.special.swipe.scrollSupressionThreshold = 10000;

现在我的代码看起来像

app.utils.scroll = (function(){
var $viewport     = undefined;
var swipeDisabled = false;

var init = function(){
    $viewport = $('#viewport');

    $viewport.mousewheel(mayChangePage);

    // See #23.
    $.event.special.swipe.scrollSupressionThreshold = 10000;

    // Listen to swipeleft / swiperight-Event to change page.
    $viewport.on('swipeleft.next', next);
    $viewport.on('swiperight.prev', prev);
}
var mayChangePage = function(e){
    // If page is not zoomed, change page (next or prev).
    if (app.utils.zoom.isZoomed() === false) {
        if (e.deltaY > 0) {
            app.utils.pagination.prev(e);
        } else {
            app.utils.pagination.next(e);
        }
    }

    // Stop scrolling page through mouse wheel.
    e.preventDefault();
    e.stopPropagation();
};
var next = function (e) {
    // If page is not zoomed, switch to next page.
    if (app.utils.zoom.isZoomed() === false) {
        app.utils.pagination.next(e);
    }
};
var prev = function (e) {
    // If page is not zoomed, switch to prev page.
    if (app.utils.zoom.isZoomed() === false) {
        app.utils.pagination.prev(e);
    }
};

$(document).ready(init);
}());

感谢 Omar，他与我一起在 jquery IRC 中写了几分钟/几个小时，并就覆盖 jQueryMobile 的标准值给出了一些建议。