如何关注页面加载后加载的元素

Question

我正在使用以下 hack-ish 方法来关注加载后的 Stripe 输入元素：

<div id="card-element">
  <!-- Load stripe stuff here -->
</div>

// <script src="https://js.stripe.com/v3/"></script>
var card = elements.create('card', {style: style});
card.mount('#card-element');

setTimeout(function(){
    card.focus();
},1000);

有没有更好的方法，即检测card元素何时“可聚焦”。如果我在页面加载时执行此操作，它只是看不到该元素（它可能尚未添加，因此它不起作用）。

这是一个示例元素：https://stripe.github.io/elements-examples/（我无法将工作示例粘贴到 jsfiddle 中，因为我不确定如何加载外部库）。

Answer 1

根据文档，您可以在元素上附加一个侦听器，然后在安装后调用焦点。

未测试代码，但应该看起来像这样

 card.on('ready', function(){
    card.focus();
    }
)