如何创建像 Stripe 结帐这样的弹出窗口

Posted 2023-03-21

【中文标题】如何创建像 Stripe 结帐这样的弹出窗口

【英文标题】：How to create a popup like Stripe checkout

【发布时间】：2018-12-10 16:57:27

【问题描述】：

我的任务是创建一个 Web 应用程序，该应用程序在其他网站上创建弹出窗口，例如 Stripe 结帐，在结帐文档 (https://stripe.com/docs/quickstart) 中使用此代码（附在下面）。我有使用 iframe 的经验，但没有使用脚本标签。

任何建议或示例代码都可以。

<form action="your-server-side-code" method="POST">   
  <script src="https://checkout.stripe.com/checkout.js" 
          class="stripe-button"     
          data-key="pk_test_g6do5S237ekq10r65BnxO6S0"     
          data-amount="999"     
          data-name="Stripe.com"    
          data-description="Example charge"     
          data-image="https://stripe.com/img/documentation/checkout/marketplace.png"     
          data-locale="auto"    
          data-zip-code="true">  
  </script> 
</form>

【参考方案1】：

您加载的内容基本上是 javascript。这是您正在加载的脚本：https://checkout.stripe.com/checkout.js。

此脚本创建名为“模态”的弹出窗口。

这是来自 W3Schools 的教程：https://www.w3schools.com/howto/howto_css_modals.asp

这应该足以让您入门。