iScroll 4 - 取消preventDefault()

时间:2013-04-18 15:25:21

标签: javascript events touch iscroll4

在下面的代码中,我添加了三条评论,可以解释问题所在。简而言之:我想知道如果已经设置了e.preventDefault();,该如何禁用它?

   var startY;
   myScroll = new iScroll(DOMElement, {
        snap: 'li',
        bounce: false,
        bounceLock: false,
        momentum: false,
        hScrollbar: false,
        vScrollbar: false,
        hScroll: true,
        vScroll: false,
        wheelAction: 'scroll',
        onBeforeScrollStart: function(e){
            startY = e.pageY;
            // By default it's advisable to disable browser's scroll
            e.preventDefault();
        },
        onScrollStart: function(){  },
        onScrollMove: function(e){
            // But here I want to enable browser's functionality if user
            // explicitly demands this (i.e. tries to scroll vertically)
            if(startY >= e.pageY+70 || startY <= e.pageY-70){
                console.log('test');
                //alert('test');
                console.log(e);
                // However, I don't know how to restore this functionality
                // Touch device detects 'test' alert correctly and this is
                // where I'm stuck.
            }
        },
        onScrollEnd: function(){ },
        onRefresh: function(){ },
        onDestroy: function(){ },
    });

任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:2)

您可以在onBeforeScrollStart中控制滚动。防止在特定区域之间滚动。如果超过,则滚动开始。我认为这会有所帮助:

var startY;
var isStarted = false;
myScroll = new iScroll(DOMElement, {
    snap: 'li',
    bounce: false,
    bounceLock: false,
    momentum: false,
    hScrollbar: false,
    vScrollbar: false,
    hScroll: true,
    vScroll: false,
    wheelAction: 'scroll',
    onBeforeScrollStart: function(e){
        var y=e.pageY;
        if (!isStarted) {
            startY = y + 0;
            isStarted = true;
        }

        if(startY < y+70 || startY > y-70){
            e.preventDefault();
        }
    },
    onScrollStart: function(){  },
    onScrollMove: function(e){ },
    onScrollEnd: function(){
        isStarted = false;
    },
    onRefresh: function(){ },
    onDestroy: function(){ },
});