将html模板动态加载到现有动态加载的div中

Question

我必须动态地将html模板加载到index.html中。现在我想将另一个html模板加载到先前加载的模板代码中。

换句话说： 用仪表板模板加载索引，仪表板有 <div id='sidebar'>将加载侧边栏模板

$("body").load("dashboard.html");
$(document).on('click', '#sidebar', function(){
    $("#sidebar).load("sidebar.html");
});

上述代码需要手动点击才能将侧边栏加载到页面中。我希望在页面加载时自动加载（仪表板和侧边栏）

我正在使用jQuery。请帮助

Answer 1

为此，请将第二个load()调用放在第一个调用的回调中，以便在dashboard.html内容添加到DOM后执行。

$("body").load("dashboard.html", function() {
  $("#sidebar").load("sidebar.html");
});