どのように最初からストライプボタンを無効にして契約を確認した後に有効にすることができますか？

Question

最初からストライプチェックアウトボタンを無効にします。その後、同意チェックボックスをチェックすると、有効になります。彼がチェックを取り消すと、再び無効になります。これどうやってするの？

<script 
    src="https://checkout.stripe.com/checkout.js" class="stripe-button" 
    data-key="pk_test_6pRNASCoBOKtIshFeQd4XMUh" 
    data-amount="2000" 
    data-name="Stripe.com" 
    data-description="2 widgets" 
    data-image="/img/documentation/checkout/marketplace.png" 
    data-locale="auto"> 
</script> 

私のコードは上記のコードと非常によく似ています。値のみが異なります。

Answer 1

自動埋め込みチェックアウトボタンの代わりにカスタムボタンを使用できます。ここでthe docs.

[OK]を

$('#agree').click(function() { 
 
    $("#customButton").toggle(this.checked); 
 
}); 
 

 
var handler = StripeCheckout.configure({ 
 
    key: 'pk_test_6pRNASCoBOKtIshFeQd4XMUh', 
 
    image: '/img/documentation/checkout/marketplace.png', 
 
    locale: 'auto', 
 
    token: function(token) { 
 
     // You can access the token ID with `token.id`. 
 
     // Get the token ID to your server-side code for use. 
 
    } 
 
    }); 
 
    $('#customButton').on('click', function(e) { 
 
    // Open Checkout with further options: 
 
    handler.open({ 
 
     name: 'Stripe.com', 
 
     description: '2 widgets', 
 
     amount: 2000 
 
    }); 
 
    e.preventDefault(); 
 
    }); 
 

 
    // Close Checkout on page navigation: 
 
    $(window).on('popstate', function() { 
 
    handler.close(); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://checkout.stripe.com/checkout.js"></script> 
 

 
<input type="checkbox" id="agree"> agree 
 
<button id="customButton" style="display:none">Purchase</button>