Question

我正在尝试将this插件集成到我的网站中，以便我可以滑动删除。然而问题是这个插件是用'swiperight'触发的，同样的滑动事件用于显示我的面板。我设法使用event.target.tagName分隔事件。当它是A（链接）时，我想激活滑动删除按钮，否则我希望我的面板可以滑入。

换句话说，pageinit事件被触发两次，因此滑动删除按钮开始出现，然后再次触发相同的事件。我想以某种方式取消一个动作，但我不能让它工作。我已经尝试过了：

event.stopImmediatePropagation();
event.stopPropagation();
event.preventDefault();

我也试过使用这里给出的一些解决方案，但没有运气： jQuery Mobile: document ready vs page events

可以找到我的问题的演示 snip ，我当前的pageinit函数是这样的：

$(document).on('pageinit', function() {
    //Activate horizontal swipe after x px.
    $.event.special.swipe.horizontalDistanceThreshold = 80;
    $('div[data-role="content"]').on("swiperight", function(event) {
        //If tagname is 'A' you probably want slide to delete not the panel
        if(event.target.tagName != 'A') {
            $.mobile.activePage.find("#menu").panel("open");
        } else {
            //Cancel swipe
            event.stopImmediatePropagation();
        }
    });

    //Swipe to delete
    $("#swipe li").swiper( {
        corners: false,
        label: "Verwijder",
        swipe: function(event, ui) {
            alert('trigger');
        },
        click: function(event, ui) {
            var $item = $(this);
            //console.log($(this));
            $item.fadeOut(250, function() {
                $item.remove();
            });
        }
    });
});

Answer 1

修复了使用以下插件的问题：TouchSwipe，可以简单地从事件中排除元素。

在jQuery Mobile中向右滑动两次

1 个答案: