setTimeout 不适用于 div 加载或锚定

Question

尝试在 30 秒后加载 div，代码非常简单，理想情况下它应该可以工作。 我想在 30 秒后加载 div 内容，所以我想单击一个虚拟锚点。 我知道我们可以在没有虚拟锚点的情况下使用 settimeout 直接加载 div 但它不起作用所以我尝试了触发器。 我试过延迟和所有其他功能。 jquery 已经加载。 因为当我手动单击它们时，它们会起作用

 $(document).ready(function() { setTimeout(function() { $('#999').trigger('click'); }, 5000); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <a href="#popup_chrome" class="popup_chrome" id="999">Chrome Extension</a> <div id="popup_chrome" class="overlay"> <div class="popup"> <h2>Download Chrome Extension</h2><br> <a class="close" href="#">×</a> <div class="content"> <br /><a href="dfdfd" target="_blank" class="myButton_sub">Download</a> </div> </div> </div>

Answer 1

使用模板来保存弹出窗口，然后在超时时使用模板内容填充一些容器：

 $(document).ready(function() { setTimeout(function() { $('#container').html($('#popup_content').html()); }, 4000); });

 #popup_chrome { margin: 15px; width: 50vw; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5); border: 1px solid silver; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <h5>Wait for it...</h5> <div id="container"></div> <template id="popup_content"> <div id="popup_chrome" class="overlay"> <div class="popup"> <h2>Download Chrome Extension</h2><br> <a class="close" href="#">×</a> <div class="content"> <br /><a href="dfdfd" target="_blank" class="myButton_sub">Download</a> </div> </div> </div> </template>