我正在尝试在Laravel应用程序中对我的表单进行条纹支付方法，但不知何故card-element无法在浏览器的控制台上呈现Stripe.elements() is not a function。
这是我的代码(去掉不相关的代码):
<head>
<script src="https://js.stripe.com/v3/"></script>
</head>
<body>
<form>
<div class="mb-6 mx-2">
<div id="card-element"></div>
</div>
<div class="mb-2 mx-2">
@csrf
<input type="hidden" id="payment_method_id" name="payment_method_id" value="">
<button type="submit" id="form_submit"> Continue to payment</button>
</div>
</form>
<script>
const stripe = Stripe("{{ env('STRIPE_KEY') }}");
const elements = Stripe.elements();
const cardElement = elements.create('card', {
});
cardElement.mount('#card-element');
</script>
</body>
我已经尝试解决这个
尝试添加load事件监听器作为:
<script>
window.addEventListener('load', function (){
const stripe = Stripe("{{ env('STRIPE_KEY') }}");
const elements = Stripe.elements();
const cardElement = elements.create('card', {
});
cardElement.mount('#card-element');
});
</script>
但仍然是相同的错误Stripe.elements() is not a function这是我所遵循的官方条纹文档。谁能告诉我，我可能做错了什么?
根据文档中的示例:
var stripe = Stripe('pk_test_TYooMQauvdEDq54NiTphI7jx'
);
var elements = stripe.elements();
elements()是Stripe的实例上的函数。代码中的Stripe.elements()大写了，可能是偶然的。