Question

我用于树视图的代码是这样的： https://bootsnipp.com/snippets/featured/quotboottreequot-treeview-for-bootstrap

我对此代码进行了稍微的修改

branch.prepend("<i class='fa fa-chevron-circle-right'></i>");
            branch.addClass('tree-branch');
            branch.on('click', function (e) {
                if (this == e.target) {
                    var icon = $(this).children('i:first');

                    icon.toggleClass("fa fa-chevron-circle-down");
                    $(this).children().children().toggle();
                }
            })

所以我基本上只是更改了类。
现在，当我单击右圆圈时，没有向下滚动。据我所知，两个fa之间的空间可能有问题？

感谢您的帮助！

Answer 1

好像您还切换了Font Awesome所需的“ fa”类。

我建议同时切换“ fa-chevron-circle-down”和“ fa-chevron-circle-right”这两个类，以免一次出现两个类。

var icon = $('#test');
icon.on('click', function() {
  icon.toggleClass("fa-chevron-circle-right fa-chevron-circle-down");
});

<link href="//use.fontawesome.com/releases/v5.3.1/css/all.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<i class='fa fa-chevron-circle-right' id="test"></i>

Answer 2

奈杰尔，请注意，在您提供的示例中，它们正在切换：

icon.toggleClass("glyphicon-chevron-down glyphicon-chevron-right");

所以您应该切换：

icon.toggleClass("fa-chevron-circle-right fa-chevron-circle-down");

无法在树形视图中从“真棒字体”切换类

2 个答案: