Javascript Jquery toggleclass赢得'；行不通

我的

toggleclass

函数不起作用，我不知道为什么。感谢您的帮助，谢谢

jsfiddle：

$（“#切换favicon”）。单击（函数（）{
$（this）.find（'span'）.toggleClass（'fa-chevron-left fa-chevron-down'）；
log（$（this.find（'span'））；
});

在最新版本的font awesome中，

将被转换为一些SVG元素。并删除相应的跨度元素

因此，要更改图标的类，需要切换此svg元素的类

还请记住，

.toggleClass

不能用于

svg

元素，因为

jqueryv1.x

不能这样做。所以您需要使用

.attr（“class”…）

方法

$('#toggle-favicon').click(function() {
  var $el = $(this).find('svg');
  $el.attr("class", function() {
    return $(this).attr("class").indexOf("fa-chevron-left") != -1 ? "fa-chevron-right" : "fa-chevron-left";
  })
});

如果您使用

jquery3.x

，那么您也可以使用

.toggleClass

$('#toggle-favicon').click(function() {
  var $el = $(this).find('svg');
  $el.toggleClass("fa-chevron-left fa-chevron-right");
});

---

由于您的span已被某个内容注释掉并替换为SVGFONT5导致此问题，因此它将您的

span

替换为

svg

。在他们的文档中，有一些选项可以避免这种情况。@Steeff很高兴它有帮助。。。一定要把答案标对：）

$('#toggle-favicon').click(function() {
  var $el = $(this).find('svg');
  $el.toggleClass("fa-chevron-left fa-chevron-right");
});