Event.cancelable

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

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

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

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

構文

bool = event.cancelable;

値

結果は Boolean で、イベントがキャンセル可能であれば true です。

例

例えば、ブラウザーベンダーは wheel イベントが、最初にリスナーが呼び出されたときのみキャンセル可能にしようと提案しています。 — その後の wheel イベントはキャンセルできません。

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);

メモ

イベントがキャンセル可能か不可能かは、イベントが初期化されたときに決定されます。

イベントをキャンセルするには、イベントの preventDefault() メソッドを呼び出してください。これはイベントに関連付けられた既定の動作を実行する実装を維持します。

仕様書

ブラウザーの互換性