javascript - 使用 Bootstrap TreeView 折叠/展开时， anchor 标记单击事件被忽略

Question

我正在使用 Twitter Bootstrap 的 treeview生成目录的插件。我为每个节点提供的链接都有 HTML 所在的位置和要转到的 anchor 标记。我解析它并将 HTML 加载到当前页面的 DIV 中，然后滚动到 anchor 标记。使用下面的代码可以正常工作，但是当我折叠或展开节点时，它会停止加载 DIV 中的 HTML 并直接打开页面，基本上忽略我在 anchor 标记上的单击事件。知道为什么点击事件不会被触发吗？

我有以下代码来监听按钮，我必须按如下方式展开或折叠整个树:

    var $treeview = $('#treeview');
    $("#expand").click(function (e) {
        e.preventDefault();
        $treeview.treeview('expandAll', { silent: true });
    });

    $("#collapse").click(function (e) {
        e.preventDefault();
        $treeview.treeview('collapseAll', { silent: true });
    });

我将静音设置为 true 以抑制事件，但随后将不再调用其中包含 href 的 anchor 标记的监听器。否则一切都会按预期工作，所以我不确定为什么这些事件调用会导致这个问题。不幸的是，我无法使用 nodeSelected 事件，因为随后单击 anchor 标记会导致加载其他 HTML 页面，这是不希望的；它需要保留在当前页面上，因此以下代码是我能够实现这一目标的唯一方法。

    $("a[href*='#']").click(function(e) {
        e.preventDefault();            
        if (this && this.href !== "") {
            // Split location and hash
            var hash = this.hash;
            var location = this.href.match(/[^#]*/g)[0];

            $('#contents').load(location, function () {
                $('html, body').animate({
                    scrollTop: $(hash).offset().top - 55
                }, 200);
            });
        }
        return false;
    });

Answer 1

也许你可以这样做

$("body").on("click", "#expand", function (e) {
    e.preventDefault();
    $treeview.treeview('expandAll', { silent: true });
});

$("body").on("click", "#collapse", function (e) {
    e.preventDefault();
    $treeview.treeview('collapseAll', { silent: true });
});

还有

$("body").on("click", "a[href*='#']",function(e) {
        e.preventDefault();            
        if (this && this.href !== "") {
            // Split location and hash
            var hash = this.hash;
            var location = this.href.match(/[^#]*/g)[0];

            $('#contents').load(location, function () {
                $('html, body').animate({
                    scrollTop: $(hash).offset().top - 55
                }, 200);
            });
        }
        return false;
    });