Javascript 无法在php中集成条带卡支付

//条带API密钥
var stripe=stripe（'pk_test_xxx'）；
//自定义样式
变量样式={
基数：{
颜色：“#32325d”，
线宽：“24px”，
fontFamily:“新赫尔维蒂卡”，赫尔维蒂卡，无衬线，
fontSmoothing:'抗锯齿'，
fontSize:'16px'，
“：：占位符”：{
颜色：“#aab7c4”
}
},
无效：{
颜色：“#fa755a”，
iconColor:“#fa755a”
}
};
//创建条带元素
var elements=stripe.elements（）；
//创建卡元素的实例
var card=elements.create（'card'，{style:style}）；
//将card元素的实例添加到“card元素”中
卡。挂载（“#卡元素”）；
//处理来自卡元素的实时验证错误。
card.addEventListener（'change'，函数（事件）{
var displayError=document.getElementById（'card-errors'）；
if（event.error）{
displayError.textContent=event.error.message；
}否则{
displayError.textContent=''；
}
});
//处理表格提交
var form=document.getElementById（'payment-form'）；
document.getElementById（“s03”）.addEventListener（'click'，函数（事件）{
event.preventDefault（）；
stripe.createToken（卡片）.then（函数（结果）{
if（result.error）{
//如果出现错误，请通知用户
var errorElement=document.getElementById（'card-errors'）；
errorElement.textContent=result.error.message；
}否则{
stripeTokenHandler（result.token）；
}
});
});
//将条带令牌发送到服务器
函数stripeTokenHandler（令牌）{
//将令牌ID插入表单，以便将其提交到服务器
var form=document.getElementById（'payment-form'）；
//将条带标记添加到隐藏输入
var hiddenInput=document.createElement（'input'）；
setAttribute（'type'，'hidden'）；
setAttribute（'name'，'stripeToken'）；
hiddenInput.setAttribute（'value'，token.id）；
表格.appendChild（hiddenInput）；
//提交表格
表单提交（）；
}

.StripeElement{
背景色：白色；
填充：8px 12px；
边界半径：4px；
边框：1px实心透明；
盒影：0 1px 3px 0#e6ebf1；
-webkit过渡：盒影150ms轻松；
过渡：长方体阴影150ms缓解；
}
.StripeElement—焦点{
盒影：0 1px 3px 0#cfd7df；
}
.StripeElement--无效{
边框颜色：#fa755a；
}
.StripeElement--webkit自动填充{
背景色：#fefde5！重要；
}

信用卡还是借记卡
继续
中止

您已将密钥包含在代码段中，应立即滚动密钥：看起来可能有卡元素，但宽度受到限制。您是否检查了标记以查看存在的内容？是否应用了任何样式来限制它？是的，这是一个滚动键，我之前为这个键设置了过期时间。它已经过期了。下面是一个在模式中显示Card元素的示例。您需要花一些时间逐步检查代码，以调试出现问题的地方。如果您可以提供一些特定的有问题的行或错误消息，我们可以提供更详细的建议。谢谢你，诺兰H，我帮你解决了错误。这只是css限制。