Question

我的网站上有此代码，因此您可以使用滑动

返回/转发

$(function() {
  $(window).on("swipeleft", jqmForward)
           .on("swiperight", jqmBack);
});

问题是，当您尝试滑动已经拥有自己的滑动处理程序的内容时，它也可以返回/前进（例如，第三方幻灯片库）

如何让它仅在“背景”工作（忽略具有自己的滑动处理程序的某些元素）？

编辑：简化上面的代码，我尝试了这个但是没有用（可能是因为我将它添加到窗口而不是单个div）

$('.swiper-wrapper').off();

Answer 1

我最终得到了一个全局变量allowGlobalSwipe，并使用Swiper API动态禁用它。

var allowGlobalSwipe = true; // <--

$(function() {
  $(window).on("swiperight", jqmBack);

  $('#slideContainer').swiper({
    onTouchStart: function () { allowGlobalSwipe = false; },   // <--
    onTouchEnd: function () { allowGlobalSwipe = true; }
  });
});

function jqmBack(e) {
  if (!allowGlobalSwipe) return;  // <--

  var prevpage = $('div.ui-page-active').prevAll('div[data-role="page"]');
  if (prevpage.length > 0)
    $.mobile.changePage($(prevpage[0]), { transition: "slide", reverse: true }, true, true);
}

要在某些元素上取消的背景滑动处理程序

1 个答案: