1

我试图将滑动效果用于移动应用程序。我已经测试并致力于更改页面。但它非常敏感。很多时候我只想滚动，他改变了页面。

是否可以在此事件中修复触摸屏上的敏感性？

这是我的代码：

$(document).on('swipeleft', '[data-role="page"]', function(event){    
    if(event.handled !== true) // This will prevent event triggering more then once
    {    
        var nextpage = $(this).next('[data-role="page"]');
        // swipe using id of next page if exists
        if (nextpage.length > 0) {
            $.mobile.changePage(nextpage, {transition: "slide", reverse: false}, true, true);
        }
        event.handled = true;
    }
    return false;         
});

$(document).on('swiperight', '[data-role="page"]', function(event){   
    if(event.handled !== true) // This will prevent event triggering more then once
    {      
        var prevpage = $(this).prev('[data-role="page"]');
        if (prevpage.length > 0) {
            $.mobile.changePage(prevpage, {transition: "slide", reverse: true}, true, true);
        }
        event.handled = true;
    }
    return false;            
});
4

2 回答 2

5

在 jQuery Mobile 中，您需要为水平和垂直拖动距离horizontalDistanceThreshold和verticalDistanceThreshold.

请注意，您需要将更改绑定到mobileinit事件，并且代码应<head>在加载 jQuery js 文件之后和加载 jQuery-Mobile js 之前放入。

<script src="jquery.js"></script>

<script>
$(document).bind("mobileinit", function(){
 $.event.special.swipe.horizontalDistanceThreshold = '100'; // default 30px
 $.event.special.swipe.verticalDistanceThreshold = '150'; // default 75px
});
</script>

<script src="jquery-mobile.js"></script>

参考：滑动事件 - jQuery Mobile

于 2013-05-13T13:41:16.973 回答
2

像这样调整滑动阈值

$.swipe.defaults.threshold.x = '30'; //for horizontal swiping sensitivity
$.swipe.defaults.threshold.y = '10'; //for vertical swiping sensitivity

只需添加这些代码即可更改应用程序滑动的全局敏感性，并在将代码放在上面之后执行常用代码

要直接更改某个元素的灵敏度，您可以执行以下操作

$('[data-role="page"]').swipe({ threshold: {x: 30, y: 20},
swipeLeft: function() { alert('swiped left') },
swipeRight: function() { alert('swiped right') }});
于 2013-05-03T17:38:02.077 回答