语义UI模式-贝宝结帐按钮不显示

Question

因此，我一直在尝试整合付款。基本思想是，只要有人单击按钮，就会显示一个包含Paypal付款结帐按钮的模式。但是，一旦出现模态，按钮就会显示出来并立即消失。 Checkout按钮在页面的任何其他部分都可以正常工作。

将发生以下情况：https://youtu.be/HkVuMLnuyps

我的HTML代码：

<div id="modal3" class="ui modal ">
            <div class="content">
                    <div class="padding20">
                            <div class="ui grid">
                                <div class="eight wide column">
                                    <div class="details-x">
                                        <h2 class="animated fadeInUp">Payment Information</h2>
                                        <span>Paying &emsp;</span>
                                        <div class="ui labeled input">
                                            <div class="ui label">
                                                $
                                            </div>
                                            <input type="number" min="1" value="1">
                                        </div>
                                        <p class="animated fadeInUp"></p>
                                    </div>
                                </div>
                                <div class="eight wide column">
                                    <div id="paypal-button-container"></div>
                                </div>
                            </div>
                        </div>
            </div>
            <div class="actions">
                <div style="float:left;">
                    <a class="ui red right icon button">
                        Cancel Payment
                    </a>
                </div>

                <div id="to3" class="ui labeled button" tabindex="0">
                    <div class="ui red button">
                        <i class="heart icon"></i> Continue to Donate
                    </div>
                    <a class="ui basic red left pointing label">
                        $1 or more
                    </a>
                </div>
            </div>
    </div>

脚本：

<script src="https://www.paypalobjects.com/api/checkout.js"></script>
<script>
        // Render the PayPal button
        paypal.Button.render({
        // Set your environment
        env: 'sandbox', // sandbox | production

        // Specify the style of the button
        style: {
          layout: 'vertical',  // horizontal | vertical
          size:   'medium',    // medium | large | responsive
          shape:  'rect',      // pill | rect
          color:  'gold'       // gold | blue | silver | white | black
        },

        // Specify allowed and disallowed funding sources
        //
        // Options:
        // - paypal.FUNDING.CARD
        // - paypal.FUNDING.CREDIT
        // - paypal.FUNDING.ELV
        funding: {
          allowed: [
            paypal.FUNDING.CARD,
            paypal.FUNDING.CREDIT
          ],
          disallowed: []
        },

        // Enable Pay Now checkout flow (optional)
        commit: true,

        // PayPal Client IDs - replace with your own
        // Create a PayPal app: https://developer.paypal.com/developer/applications/create
        client: {
          sandbox: 'MYSANDBOXID',
          production: '<insert production client id>'
        },

        payment: function (data, actions) {
          return actions.payment.create({
            payment: {
              transactions: [
                {
                  amount: {
                    total: '0.01',
                    currency: 'USD'
                  }
                }
              ]
            }
          });
        },

        onAuthorize: function (data, actions) {
          return actions.payment.execute()
            .then(function () {
              window.alert('Payment Complete!');
            });
        }
        }, '#paypal-button-container');
        </script>

直到现在我一直在尝试：

1. 试图将Paypal Checkout部门定位。
2. 试图将div移至不同的模式。
3. 搜索Internet。 （似乎没有人遇到这个问题）

语义UI版本： 2.4.2

我现在要解决的问题

我没有在模式中显示支付按钮，而是在一个div中显示了它，该div最初是隐藏的，并在单击“支付”按钮时显示。