Question

有了这个jQuery Mobile 1.9.1代码，用来在用户向右或向左滑动时显示侧面板......

$(document).on("pageinit",".ui-page",function(){

    var $page=$(this);
    $page.on("swipeleft swiperight",function(e){
        if($page.jqmData("panel")!=="open"){
            if(e.type==="swiperight"){
                $page.find("#menu").panel("open");
            }else if(e.type==="swipeleft"){
                $page.find("#menu2").panel("open");
            }
        }
    });
});

使用具有滑动功能的图像滑块时会出现问题。当我向右滑动时滑块div内部会切换到下一张照片并打开面板...

我只是尝试这样做：

    $('#full-width-slider').swipe(function(e){
        e.stopPropagation();
        e.preventDefault();
    });

但它根本不起作用。

有没有办法在div＃full-width-slider中禁用jQuery Mobile原生幻灯片功能？

提前致谢。

Answer 1

.on('swipeleft swiperight', function(e){

而不是

.swipe(function(e){

虽然我对这个答案没有百分之百的信心，但是感觉试验表明代码仍然存在问题，你可能需要对原始元素进行健全性检查，例如，

if($.inArray('full-width-slider', $.trim($(e.target).prop('id')).split(' ')) > -1){
    //full with slider is the target, so return out 
}

Answer 2

我认为你正在寻找这个：

event.stopImmediatePropagation();

这应该可以阻止滑动冒泡。

您的代码

$('#full-width-slider').swipe(function(e){
    e.stopImmediatePropagation();
    e.preventDefault();
});

禁用特定div上的滑动

2 个答案: