Ipad：使用滑动事件时，整个页面正在移动

我有一本书，如应用程序，用户可以通过滑动来翻动“页面”，问题是当用户滑动页面整个视口移动时，有没有办法防止它？Ipad：使用滑动事件时，整个页面正在移动

HTML摘录：

<div data-title="Strategy" data-role="page" role="main" tabindex="0" class="ui-page ui-body-c ui-page-active" style="min-height: 545px;"> 
    <div data-role="content" class="caspBookCon ui-content" role="main"> 

    <div class="caspBookWrapper"> 
     <div class="caspBookLeft" data-bind="event: { swiperight: prevPage },visible:true" style="display: block;"> 
<div data-title="Home" role="main" data-cafevm="sp/book/strategy"> 
    <!-- ko if: isEditable() --> 
    <a href="#" class="caspEdit" data-bind="visible: !editMode(), click:setEditMode" title="Edit"></a> 
    <!-- /ko --> 
    <div class="caspBtnGrayOverlay" data-bind="visible: editMode()" style="display: none;"> 
    <a href="#" class="caspButton caspBtnGray" data-bind="click:saveEdit">Done</a> 
    </div>

JS：

/** 
     * Move to next page. 
     * @param {[type]} d [description] 
     * @param {[type]} e [description] 
     * @return {[type]} [description] 
     */ 
     var nextPage = function(d, e) { 
      var chapter = ca.sp.book.currentChapter; 

      if(chapter.isEnd()) { 
       $.when(changeChapter(true)).then(function(chapter){ 
        showPage(chapter); 
       }); 
      } else { 
       chapter.changePage(true); 
       showPage(chapter); 
      } 
     }; 

     /** 
     * Move to previous page 
     * @param {[type]} d [description] 
     * @param {[type]} e [description] 
     * @return {[type]} [description] 
     */ 
     var prevPage = function(d, e) { 
      var chapter = ca.sp.book.currentChapter; 

      if(chapter.isStart()) { 
       $.when(changeChapter(false)).then(function(chapter){ 
        showPage(chapter); 
       }); 
      } else { 
       chapter.changePage(false); 
       showPage(chapter); 
      } 
     };

来源

2013-03-14 Tomer

你想阻止水平+垂直滚动？ – BenM 2013-03-14 10:38:41

不滚动..当滑动我想要页面改变，但我不希望整个视口移动 – Tomer 2013-03-14 10:42:38

也许有点哈克，但你可以尝试钩住ontouchmove事件<body>标签，并通过jQuery阻止它，像这样：

$("body").on({ 
    ontouchmove : function(e) { 
     e.preventDefault(); 
    } 
});

来源

2013-03-14 10:44:12

首先，不需要jQuery那里，其次，最好是在'document'而不是'body '。 – BenM 2013-03-14 10:47:30

只是禁用的document的touchmove事件：

document.touchmove = function(e) 
{ 
    e.preventDefault(); 
};

来源

2013-03-14 10:45:01 BenM

其实什么工作对我来说既是你的，@AlistairFindlay答案的组合：'$（文件）。在（ 'touchmove'，函数（E） \t \t { \t \t e.preventDefault（）; \t \t} ）;' 不知道为什么你的答案不能正常工作，但我将其标记为无论如何 – Tomer 2013-03-14 11:11:38

对不起，我发现这也阻止了滚动，所以它不是一个好的解决方案，但是你做一个+1 :) – Tomer 2013-03-14 11:31:29

我知道，你表示滚动不是一个问题... – BenM 2013-03-14 11:49:08

Ipad：使用滑动事件时，整个页面正在移动

回答

相关问题