javascript - 在 .ready 之前加载 <div> 中的 HTML

Question

起初我使用的是 JQuery Mobile。我已经研究过如何在 div 中加载 HTML，但我遇到了一些问题。

主要思想是我有 3 个不同的菜单(列表)，每个菜单都存储在服务器生成的 HTML 文件中。/Menu1.html、/Menu2.html、/Menu3.html。必须这样，因为菜单可以动态变化。

所以，菜单看起来像这样:

<ul>
  <il><a href="whatever1> Option1 </a></li>
    <ul>
      <il><a href="whatever1> Option1.1 </a></li>
    </ul>
  <il><a href="whatever2> Option2 </a></li>
</ul>

我是这样做的:

    <div id="menuview">

    </div>

    <script type="text/javascript">
        $("#menuview").load("data/menu1.html");
    </script>

它正在加载列表，对吧，但是没有 css。所以我看到的只是列表，而不是 JQM 链 TableView ，就像这里的演示:http://demos.jquerymobile.com/1.4.0/listview/

如果我手动将 menu1.html 复制到 div 中，它就可以正常工作。 我不只是在寻求解决方案，也许有更好的方法来做到这一点，但我不知道。

提前致谢!

Answer 1

当动态添加任何元素时，您需要手动初始化它们。

在您拥有的每个菜单中，添加初始化功能。

<ul>
 <!-- elements -->
 <script>
  $(function () {
    $("ul").listview();
  });
 </script>
</ul>

请注意，嵌套 ListView 已从 jQM 1.4 中删除。

要创建一个嵌套 ListView ，检查this official demo .