Laravel 5.1 - 自定义按钮 STRIPE 支付

【问题标题】：Laravel 5.1 - Custom button STRIPE paymentLaravel 5.1 - 自定义按钮 STRIPE 支付
【发布时间】：2016-10-03 15:10:56
【问题描述】：

我的电子商务中有 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 自定义脚本？

感谢您的帮助！

【问题讨论】：

标签： javascript css laravel stripe-payments

【解决方案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();
});

【讨论】：