Javascript Smarty:不能使用同一模板两次

我有以下Smary模板（它是一个文件树，单独填充文件，然后将

list\u html

分配给指定的文件树hrml）

$（“#目录列表根”）。在（“单击”，“div.content”，函数（）上{
$（“div.selected”，“#目录列表根”）.removeClass（“selected”）；
$（此）.addClass（“选定”）；
//检查目录是否已展开
var节点=$（this.parent（“li.directory”）；
if（node.hasClass（“扩展”））{
node.removeClass（“扩展”）；
$（this.sides（“ul.container”）.hide（）；
}否则{
node.addClass（“扩展”）；
$（this.sides（“ul.container”）.show（）；
}
} );

{$list_html}

在代码中，它被使用了两次（在一个接一个显示的jqueryui对话框中）。问题是，第一次处理功能正常，但第二次单击处理程序不工作。如果我从第一个对话框中删除树，则会分配第二个对话框中的处理程序

你知道怎么解决吗

提前谢谢你

---

PS.我正在运行Smarty

3.1.13

，如果这很重要。

如果模板使用两次，文档中将有两个id为

目录列表根的元素，这是非法的。结果是一切都不起作用了

不要使用固定id，而是使用动态id，每次递增一个内部计数器变量，例如使用：


$（函数（）{
{计数器名称=树分配=唯一ID}
var$root=$（“#目录列表根-{$uniqueId}”）；
$root.on（“单击”、/*等*/）；
});

{$list_html}


<script>
    $("#directory-list-root").on("click", "div.content", function() {
        $("div.selected", "#directory-list-root").removeClass("selected");
        $(this).addClass("selected");

        // Check if directory is expanded
        var node = $(this).parent("li.directory");
        if (node.hasClass("expanded")) {
            node.removeClass("expanded");
            $(this).siblings("ul.container").hide();
        } else {
            node.addClass("expanded");
            $(this).siblings("ul.container").show();
        }
    } );
</script>

<div id="directory-list-root">
    <ul class="container" style="padding:5px" id="tree">
{$list_html}
    </ul>
</div>

<script>
    $(function() {
        {counter name=tree assign=uniqueId}
        var $root = $("#directory-list-root-{$uniqueId}");

        $root.on("click", /* etc */);
    });
</script>

<div id="directory-list-root-{$uniqueId}">
    <ul class="container" style="padding:5px" id="tree">
{$list_html}
    </ul>
</div>