Background
我正在尝试将Stripe整合到我们的网站中 . 结帐页面有两个按钮选项,PayPal或Visa / Credit Card .
这是目前的代码 .
<div class="pull-right">
<a class="btn btn-lg btn-paypal" href="#">
<i class="fa fa-paypal" aria-hidden="true"></i>
PayPal
</a>
<form action="<?php echo base_url() . 'stripe/process'; ?>" method="POST">
<script src="https://checkout.stripe.com/checkout.js"
class="stripe-button"
data-key="xxxx"
data-image="your site image"
data-name="w3code.in"
data-description="Demo Transaction ($100.00)"
data-amount="10000" />
</script>
</form>
</div>
它产生了......
按钮和一切都很完美...但我希望它看起来像这样 .
代码看起来像这样......
<div class="pull-right">
<a class="btn btn-lg btn-paypal" href="#">
<i class="fa fa-paypal" aria-hidden="true"></i>
PayPal
</a>
<a type="submit" class="btn btn-lg btn-stripe">
Visa/Credit Card
<i class="fa fa-cc-stripe" aria-hidden="true"></i>
</a>
</div>
我想知道是否有办法让点击 <a>
锚标签触发表格(也许是一个隐藏的表格) .
我对这怎么可能有一个模糊的想法,所以我会尽力向你们展示我的尝试......
My Attempt
我从脚本标签中删除了 stripe-button
类,并将 onclick="document.getElementById('stripe').submit();"
添加到我的新锚标签中以提交表单,但这不具有相同的效果 .
<a type="submit" class="btn btn-lg btn-stripe" href="javascript:{}" onclick="document.getElementById('stripe').submit();">
Visa/Credit Card
<i class="fa fa-cc-stripe" aria-hidden="true"></i>
</a>
<form id="stripe" action="<?php echo base_url() . 'stripe/process'; ?>" method="POST">
<script src="https://checkout.stripe.com/checkout.js"
data-key="xxx"
data-image="your site image"
data-name="w3code.in"
data-description="Demo Transaction ($100.00)"
data-amount="10000" />
</script>
</form>
标签显示的原始条带按钮显示条带弹出窗口 before 表单已提交...如何使用我的锚标记触发相同的进程?
我哪里错了?
UPDATE-1:
仍然没有工作不幸...这是我尝试过...
<a type="submit" class="btn btn-lg btn-stripe" onclick="document.getElementByClass('stripe-button').submit();">
Visa/Credit Card
<i class="fa fa-cc-stripe" aria-hidden="true"></i>
</a>
<form action="<?php echo base_url() . 'stripe/process'; ?>" method="POST">
<script src="https://checkout.stripe.com/checkout.js"
class="stripe-button"
data-key="pk_test_uT2PnISTl40vQWojZAngFlu6"
data-image="your site image"
data-name="w3code.in"
data-description="Demo Transaction ($100.00)"
data-amount="10000" />
</script>
</form>
1 回答
你需要使用Checkout的"custom integration",这将允许你使用你想要的样式自己的按钮,并使用JavaScript来绑定Checkout 's popup to the button'的点击事件 .