Google Pay 即時示範模式

本頁面提供的 Google Pay 示範模式可讓您在 JavaScript 或 JSFiddle 中即時進行編輯。

基本範例

以下是 Google Pay 按鈕的基本範例，可讓您瞭解按鈕的實際運作方式。如要瞭解如何建立按鈕，請參閱鄰近的程式碼。

按鈕大小調整範例

以下說明如何調整 Google Pay 按鈕的大小。呼叫 buttonSizeMode 屬性設為 fill 的 createButton，然後為 #container div 設定大小。

授權付款範例

以下範例說明如何先「授權付款」，再處理付款。

採取先授權付款再進行處理這種做法，是因為如果授權失敗，使用者還有機會可以選擇其他付款方式。

處理付款授權要求的操作說明如下：

  1. 在 PaymentOptions 中註冊 onPaymentAuthorized() 回呼。
  2. 使用 PAYMENT_AUTHORIZATION 回呼意圖呼叫 loadPaymentData() 函式。
  3. 實作 onPaymentAuthorized() 回呼處理常式。

按一下 [在 JSFiddle 中編輯] 連結即可進行編輯並親自試用。

動態價格更新範例

「動態價格更新」功能可讓您動態調整總價，以反映運送地址和運送選項的變更。

請按照下列步驟設定動態價格更新功能：

  1. 在 PaymentOptions 中註冊 onPaymentAuthorized 和 onPaymentDataChanged 回呼。
  2. 使用回呼意圖呼叫 loadPaymentData() 函式。詳情請參閱相對應的範例。
  3. 實作 onPaymentAuthorized 和 onPaymentDataChanged。

按一下 [在 JSFiddle 中編輯] 連結即可進行編輯並親自試用。