【问题标题】：How to add an if else statement in my code?如何在我的代码中添加 if else 语句？
【发布时间】：2019-07-20 18:57:43
【问题描述】：

我正在尝试将 if/else 语句添加到此代码中，其中已单击切换开关以便能够再次单击它并更改为另一种颜色

HTML

<a class="reme" href="#"><i class="far fa-circle"></i> Remember Me</a>

JQUERY

$(".reme").click(function(){
$(this).css("color", "#1ABC9C");
$(this).find('i').toggleClass('far fa-cirle fas fa-circle');
});

【问题讨论】：

如果没有HTML 部分，我们真的无法提供帮助！

标签： javascript jquery font-awesome-5

【解决方案1】：

您可以为 CSS 添加样式，然后为按钮本身添加 toggleClass - 如下所示。

如果你想要别的东西，请告诉我。

我还在下面添加了if 版本，但建议不要使用它。

演示

// Click event
$(".reme").click(function() { 

  // Toggle class on the button
  $(this).toggleClass("green-text");

  // Unchanged
  $(this).find('i').toggleClass('far fa-cirle fas fa-circle');

});

.green-text {
  color: #1ABC9C;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button class="reme">Toggle</button>

另类

如果您愿意，可以使用if 语句，并检查color 的内联.css 值...但这绝对不是最好的方法。对于这个特定的用例，切换类会更好。

// Click event
$(".reme").click(function() {

 // Check if the color is set inline to the rgb version of your color - as when changed this way it enters the hex as rgb 
 if ( $(this).css("color") == "rgb(26, 188, 156)")  {
    
    // Make it black if it is
    $(this).css("color", "black");
    
  } else {
  
    // Set it as green if not
    $(this).css("color", "#1ABC9C");
    
  }
  
  $(this).find('i').toggleClass('far fa-cirle fas fa-circle');
  
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<button class="reme">Toggle</button>

【讨论】：