1

スワイプして削除できるように、このプラグインを自分のサイトに統合しようとしています。ただし、問題は、このプラグインが「スワイプ」でトリガーされ、同じスワイプ イベントを使用してパネルが表示されることです。を使用してイベントを分離することができましたevent.target.tagName。(リンク)の場合A、スワイプして削除ボタンをアクティブにしたい、そうでない場合はパネルをスライドさせたい.

つまり、pageinit イベントが 2 回トリガーされるため、スワイプして削除ボタンが表示され始め、同じイベントが再度トリガーされます。どうにかして1つのアクションをキャンセルしたいのですが、うまくいきません。私はすでに試しました:

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

また、ここに示されているいくつかのソリューションを使用しようとしましたが、うまくいきませんでした: jQuery Mobile: document ready vs page events

私の問題のデモはスニップで見つけることができ、現在の 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();
            });
        }
    });
}); 
4

1 に答える 1

0

次のプラグインを使用して問題を修正しました:イベントから要素を単純に除外する機能を持つTouchSwipe 。

于 2013-05-19T22:23:44.907 に答える