Question

如何触发PayPal Checkout按钮点击？我们有一个网站旁边的信用卡，我们将接受PayPal付款，我已决定为客户提供单选按钮，以选择客户将支付的方式以及PayPal Checkout按钮：

PayPal Checkout按钮单击本身打开PayPal安全窗口，其余工作正常。当客户点击第一个单选按钮我想再次打开PayPal安全窗口，即触发点击PayPal结账按钮。如果按钮本身出现在iframe中并且我无法触发该按钮跨域的点击事件，我该怎么办呢？有没有办法触发结账按钮点击？

以下是HTML代码：

<html>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="https://www.paypalobjects.com/api/checkout.js"></script>
    <script type="text/javascript" src="paypal.js">

    </script>
    <body>
        <div>
        <span style="vertical-align: 50%"><input id="rd" name="aaa" type="radio"/></span>
        <div id="paypal-button-container" style="display: inline-block"></div><hr/>
        <input id="rd1" name="aaa" type="radio"/>
        </div>
    </body>
</html>

和Javascript代码：

// paypal.js
// Render the PayPal button
$(function(){
    paypal.Button.render({

        // Set your environment

        //TODO: Dynamically provide sandbox or production
        env: 'sandbox', // sandbox | production

        // PayPal Client IDs - replace with your own
        // Create a PayPal app: https://developer.paypal.com/developer/applications/create

        //TODO: Dynamically provide clientID
        client: {
            sandbox:    'ZZZZZZ',
            production: '//TODO: Provide this later'
        },

        // Wait for the PayPal button to be clicked

        payment: function() {

            // Make a client-side call to the REST api to create the payment

            return paypal.rest.payment.create(this.props.env, this.props.client, {
                transactions: [
                    {
                        amount: { total: '13.10', currency: 'USD' }
                    }
                ]
            });
        },

        // Wait for the payment to be authorized by the customer

        onAuthorize: function(data, actions) {

            return actions.payment.get().then(function(paymentData) {

                $('#paypal-button-container').style.display = 'none'; //hide button

                //TODO: Show user payment details
                //TODO: Create input hidden fields and set payerID, paymentID, etc..for later authoriza/capture
            });
        },

        onClick: function(){
            $('#rd').trigger('click');
        },

    }, '#paypal-button-container');
});

编辑：作为一个工作示例，我会建议这个网站，但这与我需要的https://developer.paypal.com/demo/checkout/#/pattern/mark

有点不同

Answer 1

这不是PayPal按钮现在支持的内容。官方政策是，只需点击按钮本身即可打开结帐窗口。

Answer 2

我想我有点晚了，但我希望这会帮助那些遇到这个问题的人，就像我一样。

您可以将paypal的按钮不透明度设置为0并将其放在您自己的结帐按钮上。然后你可以将它的显示设置为“无”＃39;或者＆＃39;阻止＆＃39;取决于单选按钮值。

Answer 3

在我的情况下，出于空间原因，我只想使用完全自定义的按钮。最后，我隐藏了paypal按钮，直到鼠标悬停在溢出：隐藏的div。看起来不错 - 就像没有左/右填充的方形贝宝按钮..

背景：Paypal目前的快速结账文件显示，他们只支持80px最小尺寸的按钮，但使用CSS，看起来桌面上真正的最小尺寸为appx 120px宽。

Answer 4

首先需要清除正在使用的内容。

结帐 js ，然后使用checkout.js结帐。在2019年2月之前有效。
JavaScript sdk，则贝宝没有正式的公告，如果有人进行逆向工程，则是可能的。实际上不支持它。您无法以编程方式单击Paypal按钮。

请访问以获取更多说明：https://github.com/paypal/paypal-checkout-components/issues/512

触发PayPal结账按钮点击

4 个答案: