jquery - 忽略使用 cancelable=false 取消 touchmove 事件的尝试，例如因为滚动正在进行且无法中断

Question

完整错误:

Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.
preventDefault  @   jquery-2.2.4.min.js:3
f               @   jquery.ui.touch-punch.min.js:14
b._touchMove    @   jquery.ui.touch-punch.min.js:26
f               @   jquery-2.2.4.min.js:2
dispatch        @   jquery-2.2.4.min.js:3
r.handle        @   jquery-2.2.4.min.js:3

我正在使用touchpunch ，这可能会使问题复杂化？我尝试将 cancel: false 添加到可拖动选项中，正如此错误的大多数解决方案所建议的那样。这没有帮助。

它被不断地拖拽，30-80 次。

这是所有与拖动相关的代码:

var t;
$(document).on('touchstart','.menu-item', function (event) {
    selectItem(this);
    var self = this;
    if ($(self).hasClass('draggable')) return;
    t = setTimeout(function () {
        $(self).draggable({
            revert: 'invalid',
            helper: 'clone',
            opacity: .75,
            cancel: false,
            appendTo: 'body',
            cursorAt: {
                left: 100,
                top: 100
            },
            start: function(e, ui)
            {
                $(ui.helper).addClass("ui-draggable-helper");
                $('.menu-container').addClass('stop-scrolling');
            },
            stop: function(e, ui) {
                $('.menu-container').removeClass('stop-scrolling');
            }
        }).draggable('enable').addClass('draggable');
        $(self).trigger(event)
    }, 800);
});

$(document).on("touchend", function () {
    clearTimeout(t);
    $('.draggable:not(.ui-draggable-helper)').draggable( 'disable' ).removeClass('draggable');
});

Answer 1

我遇到了同样的问题，我通过在 jquery.ui.touch-punch.js 中添加 if 语句来修复它:

以下是原始代码(从第 31 行开始):

function simulateMouseEvent (event, simulatedType) {

  // Ignore multi-touch events
  if (event.originalEvent.touches.length > 1) {
    return;
  }

  event.preventDefault();

这是更新后的代码:

function simulateMouseEvent (event, simulatedType) {

  // Ignore multi-touch events
  if (event.originalEvent.touches.length > 1) {
    return;
  }

  if(event.cancelable) {
    event.preventDefault();
  }