防止在jQuery Mobile中使用滑动进行意外滚动



我正在使用jQuery Mobile。当向左或向右滑动时,用户可能会意外地滚动页面,经常将页面从窗口顶部"弹出"。我想在向左或向右滑动事件期间抑制页面滚动。我试过:

$('#foo').on('swipeleft swiperight', function (ev) {
    $.event.special.swipe.scrollSupressionThreshold = 100;
    ...
});

但这并不妨碍该行为。我还尝试在html和body DOM的滑动事件期间添加position: fixed。两者都不起作用,因为它们改变了页面的流程。我应该如何处理这个问题?谢谢

您可以使用像我从这里获得的那样的去抖动函数

//已最小化:仅160字节!函数debounce(a,b,c){var d;return function()}var e=this,f=arguments;clearTimeout(d),d=setTimeout(function(){d=null,c || a.apply(e,f)},b),c&&!d&&a.apply(e,f)}var myDebouncedFn=debounce(函数){//你做的所有繁重的事情},250);window.addEventListener('swipe',myDebouncedFn);

但是您应该更好地阅读jQuery Mobile文档,因为这是内置的:

$.event.special.swipe.scrollSupressionThreshold (default: 10px) – More than this horizontal displacement, and we will suppress scrolling.
$.event.special.swipe.durationThreshold (default: 1000ms) – More time than this, and it isn't a swipe.
$.event.special.swipe.horizontalDistanceThreshold (default: 30px) – Swipe horizontal displacement must be more than this.
$.event.special.swipe.verticalDistanceThreshold (default: 75px) – Swipe vertical displacement must be less than this.

在Beta 2中,他们发布了一些额外的滑动功能

  • http://jquerymobile.com/blog/2011/08/03/jquery-mobile-beta-2-released/

添加了可配置的滑动事件阈值

在jquery.mobile.event.js扫码。对于需要调整的开发人员这些常数允许更大的垂直位移注册一次滑动,这个新功能可以对它们进行调整。谢谢感谢mlidwin对此的贡献。

  • scrollSupressionThreshold(默认值:10px)–超过此水平位移,我们将抑制滚动
  • durationThreshold(默认值:1000ms)–超过此时间,并且不是滑动
  • horizontalDistanceThreshold(默认值:30px)–水平滑动位移必须大于这个
  • verticalDistanceThreshold(默认值:75px)–滑动垂直位移必须小于此值

最新更新