PaymentRequest: paymentmethodchange 事件
當用戶在給定的支付處理程式內更改支付方式時，paymentmethodchange 事件會被髮送到 Payment Request API 的 PaymentRequest 物件。
例如，如果使用者在他們的 Apple Pay 賬戶中從一張信用卡切換到另一張，則會觸發 paymentmethodchange 事件，告知您此更改。
此事件不可取消，也不會冒泡。
語法
在諸如 addEventListener() 之類的方法中使用事件名稱，或設定事件處理程式屬性。
addEventListener("paymentmethodchange", (event) => { })
onpaymentmethodchange = (event) => { }
事件型別
一個 PaymentMethodChangeEvent。繼承自 Event。
事件屬性
除了以下屬性之外，此介面還包含從 PaymentRequestUpdateEvent 繼承的屬性。
methodDetails只讀-
一個包含支付方法特定資料的物件，在處理支付方法更改時很有用。如果沒有此類資訊，則此值為
null。 methodName只讀-
一個字串，包含支付方法識別符號，該字串唯一標識特定的支付方法。此識別符號通常是在支付過程中使用的 URL，但也可以是標準化的非 URL 字串，例如
basic-card。預設值為為空字串""。
示例
讓我們來看一個例子。此程式碼建立了一個新的 PaymentRequest，透過呼叫請求的 addEventListener() 來新增 paymentmethodchange 事件的處理程式，然後呼叫 show() 向用戶顯示支付介面。
該程式碼假定存在一個 detailsForTransaction() 方法，該方法將返回一個物件，該物件可以作為 PaymentRequest 建構函式的 details 引數傳遞。
const paymentRequest = new PaymentRequest(
paymentMethods,
detailsForTransaction(),
);
paymentRequest.addEventListener("paymentmethodchange", handlePaymentChange);
paymentRequest
.show()
.then((response) => response.complete("success"))
.catch((err) => console.error(`Error handling payment request: ${err}`));
事件處理程式本身 handlePaymentChange() 看起來像這樣
handlePaymentChange = (event) => {
const detailsUpdate = {};
if (event.methodName === "https://apple.com/apple-pay") {
const serviceFeeInfo = calculateServiceFee(event.methodDetails);
Object.assign(detailsUpdate, serviceFeeInfo);
}
event.updateWith(detailsUpdate);
};
首先檢視事件的 methodName 屬性；如果該屬性指示使用者正嘗試使用 Apple Pay，我們將 methodDetails 傳遞給一個名為 calculateServiceFee() 的函式。我們可以建立該函式來接收有關交易的資訊，例如用於服務 Apple Pay 請求的底層信用卡，並計算並返回一個物件，該物件指定將應用於 PaymentRequest 的更改，以新增支付方法可能需要的任何服務費。
在事件處理程式返回之前，它會呼叫事件的 updateWith() 方法，將更改整合到請求中。
規範
| 規範 |
|---|
| Payment Request API # dfn-paymentmethodchange |
| Payment Request API # onpaymentmethodchange 屬性 |
瀏覽器相容性
載入中…