我有一个可展开和折叠的手风琴。以下是代码:https://jsfiddle.net/96jqo3ba/2/。我想使用FontAwesome图标类来表示手风琴选项卡展开和折叠时的状态。
这是我想要使用的两个FontAwesome类:
在cshtml中,我已经添加了
Jquery:
<i class="fas fa-plus" /i>
<i class="fas fa-minus" /i>
在cshtml中,我已经添加了
<i class="fas fa-plus"/i>
。我的问题是,在我的Jquery脚本中,当手风琴选项卡展开和折叠时,如何在<i class="fas fa-plus" /i>
和 <i class="fas fa-plus" /i>
之间切换?Jquery:
var coll = document.getElementsByClassName("accordion-toggle");
for (var i = 0; i < coll.length; i++) {
coll[i].addEventListener("click", function(evnt) {
const currClassList = evnt.currentTarget.classList;
if (currClassList.contains('collapsed')) {
evnt.currentTarget.classList.remove("collapsed");
var content = evnt.currentTarget.nextElementSibling;
content.style.maxHeight = null;
} else {
for (var j = 0; j < coll.length; j++) {
coll[j].classList.remove("collapsed")
coll[j].nextElementSibling.style.maxHeight = null;
}
this.classList.toggle("collapsed");
var content = this.nextElementSibling;
if (content.style.maxHeight){
content.style.maxHeight = null;
} else {
content.style.maxHeight = content.scrollHeight + "px";
}
}
});
}