Question

我正在尝试用图标切换内容，当我单击加号时，图标正在更改，但不再更改为减号。基本上我想为所有未打开的面板添加加号。这是js：

requirements.txt

$(".toggle").click(function(e) {		 
  $( this ).find('span').toggleClass( "accordion_icon_close accordion_icon_open" );	    
   var $next=$(this).next().toggle(400);			
   $('.answer').not($next).hide();	
});

Answer 1

检查答案，我使用fa图标，因为我没有设置您的图标。然后在toggleClass()

中添加您要替换的类

$(document).ready(function() {
  $(".toggle").click(function(e) {
    $(this).find('i').toggleClass("fa-minus");
    var next = $(this).next().toggle(400);
     $('.answer').not(next).hide(400);
     $('.toggle').not(this).find('i').removeClass('fa-minus').addClass("fa-plus");
  });
});

.answer {
  display: none
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
<div class="container">
 <div class="toggle " profile='1' id="plus">Toggle <i class="fa fa-plus"></i>  </div>
 <div class="answer" rel='profile_1'>Answer</div>
<div>
<div class="container">
<div class="toggle" profile='2'>Toggle <i class="fa fa-plus"></i></div>
<div class="answer" rel='profile_2'>Answer</div>
<div>

无法在jQuery中切换图标

1 个答案: