1. ホーム
  2. javascript

[解決済み】パッシブイベントリスナー内部でpreventDefaultができない

2022-01-18 18:13:40

質問

を使っています。 Framework7 ソート可能なリスト で、うまく動作しています。ただ、リストが変更されたときにイベントがトリガーされないのです。

そこで、いくつかのビルトインイベントを試しています。

$('.sortable-handler').on('touchstart', function (e) {
    e.preventDefault();
    alert('touchstart');
});

$('.sortable-handler').on('touchmove', function (e) {
    e.preventDefault();
    console.log('touchmove');
});

$('.sortable-handler').on('touchcancel', function (e) {
    e.preventDefault();
    console.log('touchcancel');
});

$('.sortable-handler').mouseleave(function (e) {
    e.preventDefault();
    console.log('mouseleave');
});

... しかし、私が得るすべては。

ターゲットがパッシブイベントリスナーであるため、パッシブイベントリスナー内部でpreventDefaultができない。 はパッシブとして扱われます。参照 https://www.chromestatus.com/features/5093566007214080

ソートごとに更新されたリストを取得するには、どのイベントを探せばよいのでしょうか?

どのように解決するのですか?

Framework7 でソート可能なリストにおいて、現在ソートしている要素を新しい位置で解放する場合、次のコードを使用することができます。

  $$('li').on('sortable:sort',function(event){
    alert("From " + event.detail.startIndex + " to " + event.detail.newIndex);
  });

フィドル: https://jsfiddle.net/0zf5w4y7/