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

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

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

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

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