Question

我必须在Stripe项目中实现ASP.NET表单，并愿意执行以下操作：

这可以正常工作，并且能够在ASP.NET项目中创建包含所需文件的表单以进行集成。但是，当从JsFiddle导入所有必需的文件时，我无法在文本框中书写。尽管我的所有引用都包含以下代码：

<input type="hidden" name="token" />
<div class="group">
  <label>
    <span>Card number</span>
    <div id="card-number-element" class="field"></div>
    <span class="brand"><i class="pf pf-credit-card" id="brand-icon"></i></span>
  </label>
  <label>
    <span>Expiry date</span>
    <div id="card-expiry-element" class="field"></div>
  </label>
  <label>
    <span>CVC</span>
    <div id="card-cvc-element" class="field"></div>
  </label>
  <label>
    <span>Postal code</span>
    <input id="postal-code" name="postal_code" class="field" placeholder="90210" />
  </label>
</div>
<button type="submit">Pay $25</button>
<div class="outcome">
  <div class="error"></div>
  <div class="success">
    Success! Your Stripe token is <span class="token"></span>
  </div>
</div>

我使用浏览器的检查功能在控制台中遇到异常-未捕获的IntegrationError：您指定的选择器（＃card-number-element）不适用于该页面上当前没有的DOM元素。在调用mount（）之前，请确保该元素存在于页面上。我在这里错过了什么吗？还有一件事，我愿意从元素（例如卡号）中获取值。实际上有可能得到吗？虽然我之前尝试过，但是无法检索由元素生成的输入类型的name属性的值，如下所示：

var cardNo = $('select[name=cardnumber]').val();

Answer 1

该错误可能意味着您的代码已在DOM完全加载之前运行（在JSFiddle上，所有代码在load事件之后运行）。您可能想要移动将Stripe元素安装到load事件的处理程序中的代码。

window.onload = function(){
  ...
  var cardNumberElement = elements.create('cardNumber', {
    style: style
  });
  cardNumberElement.mount('#card-number-element');
  ...
}

我愿意从元素（例如卡号）中获取值。实际上有可能得到它吗？

否，对于PCI-compliance reasons，Elements不允许访问原始卡的详细信息。

表格中未设置条纹元素

1 个答案: