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>