javascript - 单击元素时更改字体颜色

Question

我正在尝试弄清楚，当我单击“左”和“中心”容器时，我的“页脚文本”会变为红色，而当我单击任何容器(左右和中心)时，它会如何变化变回白色

我当前的 HTML 是这样的:

<p class="footertext" style="color:red">Designed by Clarke Cribb<br></p>


    <div class="container" id= "left" >
        <h1 style="color:white"><a>HAIR</a></h1>
    </div>

    <div class= "container" id= "center">
        <h1 style="color:white"><a>BEAUTY<a/></h1>
    </div>

    <div class="container" id= "right">
        <h1 style="color:white"><a>BARBERS</a></h1>
    </div>
</div>

我的 Javascript 是这样的:

<script>
    $(document).ready(function(){
        $("#left").click(function(){
            $("footertext").css("color","red");
        });
    });
</script>

如果有人能提供帮助，我将不胜感激。干杯。克拉克

Answer 1

尝试以下操作

 <script>

   $(document).ready(function(){
 $("#left,#center").click(function(){ 
  if($(".footertext").css("color") == 'rgb(255, 0, 0)')
  {
    $(".footertext").css("color","white");
  }
  else
  {
    $(".footertext").css("color","red");
  }
});
$("#right").click(function(){
  $(".footertext").css("color","white");
});
 });
</script>

希望对您有所帮助!