Question

我尝试了几种不同的jQuery方法，但却无法实现这一点。我只是在寻找一个简单的解决方案来切换2个fontawesome图标。我点击时可以看到添加了新类，但旧类没有被删除。

$('.arrow-up').on('click', function(){
        $('.fa-chevron-down').toggleClass('fa-chevron-up');
      });

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" integrity="sha384-AysaV+vQoT3kOAXZkl02PThvDr8HYKPZhNT5h/CXfBThSRXQ6jW5DO2ekP5ViFdi" crossorigin="anonymous">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

<div class="container">
	<div class="row">
		<div class="col-md-10 offset-md-2 pt-3">
			<div class="btn btn-success arrow-up">
				<i class="fa fa-chevron-down">
              </i>
				Show this</div>
		</div>
	</div>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

任何帮助将不胜感激。

Answer 1

通过使用空格分隔两个类来切换它们。

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" integrity="sha384-AysaV+vQoT3kOAXZkl02PThvDr8HYKPZhNT5h/CXfBThSRXQ6jW5DO2ekP5ViFdi" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

<div class="container">
  <div class="row">
    <div class="col-md-10 offset-md-2 pt-3">
      <div class="btn btn-success arrow-up">
        <i class="fa fa-chevron-down">
              </i>
        Show this</div>
    </div>
  </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

＆＃13;

string controllerName = this.ControllerContext.RouteData.Values["controller"].ToString();

＆＃13;

toggleClass问题，切换图标不切换

1 个答案: