javascript - 允许子元素的 touchmove

Question

我想为我的整个 jqm Web 应用程序禁用滚动，但是如果您尝试在具有特定类的 div 上滚动，则允许滚动

所以我的滚动 div.info已overflow:scroll应用于它，我有这个脚本来尝试检测你是否正在触摸它

$('.info').bind('touchstart', function (e) {
    if (e.type == "touchstart") {
       return true; 
    } else {
        event.preventDefault();
    }
});
$(document).bind('touchmove', function () {
    event.preventDefault();
})

现在，文档的滚动已关闭，但是当我尝试滚动我的信息 div 时，它不会滚动。

现在我看到了一些关于这个相同想法的帖子，但主要是关于固定对象位置，以便在滚动文档时，它保持在同一个位置。

Answer 1

这就是我一直在做的事情：

$(document).on('touchmove', function(ev) {
 if ( !$(ev.target).closest('.is-scrollable').length ) {
    ev.preventDefault();
  }
})

在这种情况下.is-scrollable，你的班级在哪里。.info

编辑：修复可滚动 div 顶部和底部的滚动：

$('.is-scrollable').on('touchstart', function() {
    var el = $(this);
    if ( el.scrollTop() <= 0 ) {
      el.scrollTop(1);
    }
    if ( el.scrollTop() >= el[0].scrollHeight ) {
      el.scrollTop(el[0].scrollHeight - 1);
    }
});