微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jquery 在类更改时显示/隐藏

如何解决jquery 在类更改时显示/隐藏

我有两个按钮,但我只希望第二个按钮显示一个按钮是否具有某个类(当用户点击它时会发生变化)。

这是我试过的。我没有收到任何错误,但显示/隐藏不起作用。第二个按钮应该在第一个按钮具有 btn-success 类时显示,否则必须隐藏。

$(document).ready(function(){
  if($(".save_ans").length && (".btn-success").length){
    $(".submit_ans").show();
  }else{
   $(".submit_ans").hide();
  }
   }); 

jsfiddle 示例:https://jsfiddle.net/btc6rg9d/

解决方法

您可以使用 hasClass 来检查 save_ans 是否具有 btn-success 类,具体取决于此隐藏/显示您的下一个元素。

演示代码

$(".save_ans").hasClass('btn-success') ? $(".submit_ans").show() :
  $(".submit_ans").hide()
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

<a class='btn save_ans btn-warning' href="#">Save answer</a> <br> <br>

<a class='btn  submit_ans' href="#">Submit Answers</a> <br>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。