javascript – PayPal快速结账与一个页面上的多个按钮集成

我目前有一个项目列表,其中每个项目都有一个Paypal按钮.每个项目将通过单击其关联按钮单独购买.

<ul>
    <li data-id="1">Item 1 <div class="paypal-button"></div></li>
    <li data-id="2">Item 2 <div class="paypal-button"></div></li>
    <li data-id="3">Item 3 <div class="paypal-button"></div></li>
</ul>

<script src="https://www.paypalobjects.com/api/checkout.js"></script>

<script>
    paypal.Button.render({
        // options
    }, '.paypal-button');
</script>

不幸的是,似乎paypal.Button.render()只会呈现它找到的第一个元素.

是否可以对多个元素进行此调用？

解决方法:

您需要为每个元素赋予唯一的ID,然后多次调用render：

<ul>
    <li data-id="1">Item 1 <div id="button-1"></div></li>
    <li data-id="2">Item 2 <div id="button-2"></div></li>
    <li data-id="3">Item 3 <div id="button-3"></div></li>
</ul>

<script src="https://www.paypalobjects.com/api/checkout.js"></script>

<script>
    [ '#button-1', '#button-2', '#button-3' ].forEach(function(selector) {
        paypal.Button.render({
            // options
        }, selector);
    });
</script>

标签：javascript,paypal,express-checkout
来源： https://codeday.me/bug/20190727/1552494.html