Question

我的电子商务中有Stripe付款按钮，如下所示：

<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="pk_test_yNuawoy0jUqj1GC14jwcQR5d"
data-amount="{{ $total * 100}}"
data-name="dixard"
data-description="Widget"
data-image="https://s3.amazonaws.com/stripe-uploads/acct_14s03fK9wMx3sd9Bmerchant-icon-1416180891533-icona.jpg"
data-locale="auto"
data-currency="eur"
data-id="stripe">
</script>

我想用css风格来制作这个按钮，这可能吗？我怎么能用CSS自定义脚本？

感谢您的帮助！

Answer 1

您无法使用CSS自定义默认按钮，但您可以使用自己的按钮。我们的想法是使用Custom Checkout代替。您将有一些Javascript代码添加到您的页面，以便您可以将单击处理程序附加到您自己的按钮，该按钮将自动触发Checkout。

你可以在这里看到一个基本的例子：http://jsfiddle.net/ra010dby/1/但你的想法是你做这样的事情：

var handler = StripeCheckout.configure({
  key: 'pk_test_6pRNASCoBOKtIshFeQd4XMUh',
  token: function(token) {
      $("#stripeToken").val(token.id);
      $("#stripeEmail").val(token.email);
      $("#myForm").submit();
  }
});

$('#customButton').on('click', function(e) {
  var amount = $("#amount").val() *100;
  // Open Checkout with further options
  handler.open({
    name: 'Demo Site',
    description: '2 widgets ($20.00)',
    amount: amount
  });
  e.preventDefault();
});

Laravel 5.1 - 自定义按钮STRIPE付款

1 个答案: