PaymentRequest: shippingoptionchange 事件
已弃用：此特性不再推荐。虽然某些浏览器可能仍然支持它，但它可能已经从相关的网络标准中删除，可能正在删除过程中，或者可能仅为兼容性目的而保留。请避免使用它，如果可能，请更新现有代码；请参阅本页底部的兼容性表格以指导您的决策。请注意，此特性可能随时停止工作。
非标准：此特性未标准化。我们不建议在生产环境中使用非标准特性，因为它们浏览器支持有限，并且可能会更改或被移除。但是，在没有标准选项的特定情况下，它们可以是合适的替代方案。
对于那些请求送货信息的支付请求，并且提供了送货选项的，每当用户从可用选项列表中选择一个送货选项时，就会向 PaymentRequest 发送 shippingoptionchange 事件。
当前选定的送货选项的字符串可以在 shippingOption 属性中找到。
此事件不可取消，也不会冒泡。
语法
在诸如 addEventListener() 之类的方法中使用事件名称，或设置事件处理程序属性。
addEventListener("shippingoptionchange", (event) => { })
onshippingoptionchange = (event) => { }
事件类型
一个 PaymentRequestUpdateEvent。继承自 Event。
事件属性
仅提供从 Event 继承的属性。
示例
此代码段为 shippingoptionchange 事件设置了一个处理程序。该代码根据所选的送货选项重新计算支付的总费用。例如，如果有三个选项（例如“免费陆运”、“两天空运”和“次日达”），每次用户选择其中一个选项时，都会调用此事件处理程序来根据更改的送货选项重新计算总额。
paymentRequest.addEventListener("shippingoptionchange", (event) => {
const value = calculateNewTotal(paymentRequest.shippingOption);
const total = {
currency: "EUR",
label: "Total due",
value,
};
event.updateWith({ total });
});
调用自定义函数 calculateNewTotal() 来根据 shippingOption 指定的新选送货选项计算更新后的总额后，通过调用事件的 updateWith() 方法将修订后的总额提交回支付请求。
您也可以使用其对应的事件处理程序属性 onshippingoptionchange 来创建 shippingoptionchange 的事件处理程序。
paymentRequest.onshippingoptionchange = (event) => {
const value = calculateNewTotal(paymentRequest.shippingOption);
const total = {
currency: "EUR",
label: "Total due",
value,
};
event.updateWith({ total });
};
浏览器兼容性
加载中…