jquery - 在多个位置引用 HTML？

Question

我正在使用 jQuery 选项卡，并且我有一堆由查询填充的下拉列表。事情是完全相同的下拉菜单（具有相同的选项）在不同的选项卡/对话框上（基本上它们被多次使用）。我想知道是否有办法在每个使用它们的地方复制/粘贴相同的选择/选项输出的 html。有没有办法可以参考它们？这样我加载的页面不是 5,000 行长。希望这是有道理的。

Answer 1

将页面的文件扩展名更改为 .php 并使用该include()功能从另一个仅包含菜单代码的文件中提取菜单代码。

所以基本上，把你想要复制的所有下拉菜单代码，从主文件中删除，然后放到它自己的文件中（比如dropdown.php）。然后，在主页代码中您想要将此代码拉入的任何地方，您所要做的就是添加<?php include('dropdown.php'); ?>，您就可以开始了！

Answer 2

您的 javascript 可以克隆一个节点并将其附加到您想要的任何位置。

$(document).ready(function(){
    var my_nav_containers = ["nav1", "nav2", "nav3"];

    for(var i = 0; i < my_nav_containers.lengt; i++) {
        var cloned_nav_menu = $("#seed_nav_menu").clone(true);
        $(cloned_nav_menu).attr("id", (my_nav_containers[i] + "_cloned_menu"));
        $("#". my_nav_containers[i]).append(cloned_nav_menu);
    }
})