PaymentRequest: shippingaddresschange イベント

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

非推奨: この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。

非標準: この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。

shippingaddresschange イベントは、ユーザーが配送先を選択したとき、または配送先の詳細を変更したときに PaymentRequest オブジェクトに送られます。

このイベントはキャンセル不可で、バブリングしません。

構文

このイベント名を addEventListener() のようなメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。

js
addEventListener("shippingaddresschange", (event) => {});

onshippingaddresschange = (event) => {};

イベント型

イベントプロパティ

Event から継承したプロパティのみを提供しています。

使用上の注意

ブラウザーによっては、プライバシー保護のため、配送先情報が編集される場合があります。つまり、配送先住所を含む PaymentAddress は、ユーザーの同意なしにユーザーを特定できないようにするために、そのコンテンツの一部が変更、不明瞭化、または完全に削除されることがあります(ユーザーが商品を発送することを選んだ場合は、その住所が必要になるため)。

この例では、shippingaddresschange イベントのハンドラーを設定して、住所がウェブアプリケーションが設定した要件を満たしているかどうかを検証しています。

js
const paymentRequest = new PaymentRequest(methodData, details, options);

paymentRequest.addEventListener(
  "shippingaddresschange",
  (event) => {
    let detailsUpdate = checkAddress(paymentRequest.shippingAddress);
    event.updateWith(detailsUpdate);
  },
  false,
);

const checkAddress = (theAddress) => {
  let detailsUpdate = {};

  // Check the address, return an object with any changes or errors.

  return detailsUpdate;
};

shippingaddresschange のハンドラーは、onshippingaddresschange イベントハンドラープロパティを用いて確立することもできます。

js
paymentRequest.onshippingaddresschange = (event) => {
  let detailsUpdate = checkAddress(paymentRequest.shippingAddress);
  event.updateWith(detailsUpdate);
};

ブラウザーの互換性

BCD tables only load in the browser