使用 Braintree 的托管字段加载表单时，如何使浏览器专注于长信用卡号字段

Question

我正在使用 BrainTree 托管字段

https://developers.braintreepayments.com/guides/hosted-fields/overview/javascript/v3

对于支付网关。

加载信用卡表单后，用户必须单击输入才能开始。

我的客户希望长卡号的输入框已经成为焦点。 我无法弄清楚如何执行此操作，因为出于安全原因，表单位于 iFrame 中，并且文档中的选项数量似乎并未涵盖将 textarea 设置为焦点。

我在这里遗漏了什么，或者这根本不可能？

Answer 1

您所要求的对于任意 3rd 方 iframe 是不可能的，但 Braintree 的 API 似乎确实允许通过在托管字段实例上使用focus() 方法来实现：

hostedFieldsInstance.focus('fieldname', function (focusErr) {
  if (focusErr) {
    console.error(focusErr);
  }
});

Answer 2

在处理 iFrame 时，这就是问题所在。 您可以手动聚焦 iFrame，即使有延迟或没有延迟，但如果 iFrame 提供者没有开发表单来聚焦该元素并且不提供 postMessage API，那么您基本上没有选择，因为它在您的范围之外沙箱。 如果这是可能的，基本上浏览器的安全性将受到损害。

Answer 3

结束问题，因为这是不可能的。

所有“解决方案”都试图破坏客户卡详细信息的安全性。