亚马逊支付钱包小部件不滚动

Question

我正在为一个网站更新amazonpay实施，以实现新的授权流程，该流程已成功实施。然而，我发现之前的钱包小部件工作不正常。

shipping和wallet窗口小部件都会呈现，但滚动钱包以选择不同的支付方式（并测试授权流程的其他结果）不起作用。

具体来说，当我单击右箭头以显示下一个方法时，唯一的更改是显示左箭头，在这个过程中，显示或结果没有任何更改。

由于这些都是亚马逊生成的脚本中的内容，因此我不知道如何调查该站点未修改版本中也存在的问题。

首先设置客户端id，然后设置amazon库：

<script type="text/javascript" src="https://static-eu.payments-amazon.com/OffAmazonPayments/gbp/sandbox/lpa/js/Widgets.js"></script>
<script type="text/javascript" src="https://static-eu.payments-amazon.com/v2/login.js" id="OffAmazonPaymentsLoginJS"></script>

以及小部件本身：

<script>
  new OffAmazonPayments.Widgets.AddressBook({
    sellerId: '..........',
    onOrderReferenceCreate: function(orderReference) {
      window.AmazonOfflineData = window.AmazonOfflineData || {};
      window.AmazonOfflineData['AmazonOrderReferenceId'] = orderReference.getAmazonOrderReferenceId();
    },
    onAddressSelect: function(orderReference) {
      if ( typeof checkout_cbai_address_change == 'function' ) checkout_cbai_address_change();

      if ( !window.OffAmazonPaymentsWalletRendered ) {
        new OffAmazonPayments.Widgets.Wallet({
          sellerId: '.........',
          onPaymentSelect: function (orderReference) {
            if (typeof checkout_cbai_payment_change == 'function') checkout_cbai_payment_change();
          },
          design: {
            designMode: 'responsive'
          },
          onError: function (error) {
            console.log(error.getErrorCode() + ' ' + error.getErrorMessage());
          }
        }).bind("AmazonWalletWidget");
        window.OffAmazonPaymentsWalletRendered = true;
      }
    },
    design: {
      designMode: 'responsive'
    },
    onError: function(error) {
      console.log(error.getErrorCode() + ' ' + error.getErrorMessage());
    }
  }).bind("AmazonAddressWidget");
</script>

谢啦！

Answer 1

这可能是由样式定义引起的问题。小部件下面的箭头用于圈出小部件下面通常显示的地址，请参见下面以红色标记的部分。

您可能正在使用一个sty定义，该定义将小部件缩小到了地址不再可见的高度，因此看起来箭头不会起任何作用。

集成指南中说明了最佳样式定义：

css prettyprint-override">#addressBookWidgetDiv {
  min-width: 300px;
  width: 100%;
  max-width: 900px;
  min-height: 228px;
  height: 240px;
  max-height: 400px;
}

#walletWidgetDiv {
  min-width: 300px;
  width: 100%;
  max-width: 900px;
  min-height: 228px;
  height: 240px;
  max-height: 400px;
}