Event: cancelable プロパティ

cancelable は Event インターフェイスの読み取り専用プロパティで、イベントがキャンセル可能かどうか、イベントが発生しないように抑止することができるかを示します。

イベントがキャンセルできない場合、 cancelable プロパティは false となり、イベントが発生することをイベントリスナーが抑止することができないことを示します。

ブラウザーネイティブのイベントのうち、キャンセル可能なもののほとんどは、ユーザーのページとの対話の結果から発生したものです。 click, wheel, beforeunload の各イベントをキャンセルすると、それぞれユーザーが何かをクリックすること、ページをスクロールすること、他のページに移動することをそれぞれ抑止することができます。

その他の JavaScript によって作成されたカスタムイベントは、作成時にキャンセル可能であるかどうかを制御します。

イベントをキャンセルするには、そのイベントに対して preventDefault() メソッドを呼び出してください。これにより、実装はイベントに関連付けられた既定のアクションを実行しないようになります。

複数の種類のイベントを処理するイベントリスナーは、 preventDefault() メソッドを呼び出す前に cancelable をチェックしたほうがいいかもしれません。

function preventScrollWheel(event) {
  if (typeof event.cancelable !== "boolean" || event.cancelable) {
    // The event can be canceled, so we do so.
    event.preventDefault();
  } else {
    // The event cannot be canceled, so it is not safe
    // to call preventDefault() on it.
    console.warn(`The following event couldn't be canceled:`);
    console.dir(event);
  }
}

document.addEventListener("wheel", preventScrollWheel);