Невозможно переключить класс из Font Awesome в виде дерева - PullRequest
Новая
       9

Невозможно переключить класс из Font Awesome в виде дерева

0 голосов
/ 11 октября 2018

Код, который я использовал для своего дерева, выглядит так: 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();
                }
            })

Так что я просто изменилклассы.
Теперь, когда я нажимаю на кружок-вправо, никакого провала нет.Насколько я знаю, может быть проблема с пробелом между двумя фа?

Спасибо за помощь!

Ответы [ 2 ]

0 голосов
/ 11 октября 2018

Найджел, пожалуйста, обратите внимание, что в предоставленном вами образце они переключаются: 

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

Поэтому вы должны переключиться: 

icon.toggleClass("fa-chevron-circle-right fa-chevron-circle-down");
0 голосов
/ 11 октября 2018

Похоже, вы также переключаете класс "fa", который необходим для Font Awesome.

Я рекомендую переключать оба класса, "fa-chevron-circle-down" и "fa-chevron-круг-вправо ", так что он не получает оба класса одновременно. 

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>
...