主页 / 问题 / 641446
Accepted
ridercarver
Asked:2020-03-19 18:42:30 +0000 UTC2020-03-19 18:42:30 +0000 UTC

jquery 类条件 [关闭]

  • 772

亲爱的斯塔克居民，我征求意见。

有一个代码。家长申请 申请人申请 

$(document).ready(function() {
  if ($('li').hasClass('active')) {
    $('.bbd').addClass('acc')
  } else {
    $('.bbd').removeClass('acc')
  }
});
.acc {
    border-bottom: 1px dotted #024a78;
}
.acc:link,
.acc:visited,
.acc:hover,
.acc:active{
    border-bottom: 1px dotted #024a78;
    
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="nav nav-tabs borders">
  <li class="semi active">
    <a href="#tab-1" data-toggle="tab">
      <span class="bbd">Заявка родителя</span>
    </a>
  </li>
  <li class="semi">
    <a href="#tab-2" data-toggle="tab">
      <span class="bbd">Заявка соискателя</span>
    </a>
  </li>
</ul>

有必要在活动时出现 borderbottom。

jquery

2 个回答

  1. Best Answer

    使用心灵感应模块，我告诉你，从每个人中删除这个班级，然后将班级添加到具有活动班级的 li 孩子会容易得多。

    $(document).ready(function() {
  $('li .bbd').removeClass('acc');
  $('li.active .bbd').addClass('acc');

});
    .acc {
    border-bottom: 1px dotted #024a78;
}
.acc:link,
.acc:visited,
.acc:hover,
.acc:active{
    border-bottom: 1px dotted #024a78;
    
}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="nav nav-tabs borders">
  <li class="semi active">
    <a href="#tab-1" data-toggle="tab">
      <span class="bbd">Заявка родителя</span>
    </a>
  </li>
  <li class="semi">
    <a href="#tab-2" data-toggle="tab">
      <span class="bbd">Заявка соискателя</span>
    </a>
  </li>
</ul>

    • 2

  2. 我知道这个选项

    $("li .bbd").click(function(){ 
	  $("li .bbd").each(function(){
		  $(this).removeClass("acc");
	  });
	     $(this).addClass("acc");
 });
    .acc {
    border-bottom: 1px dotted #024a78;
}
.acc:link,
.acc:visited,
.acc:hover,
.acc:active{
    border-bottom: 1px dotted #024a78;
    
}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="nav nav-tabs borders">
  <li class="semi active">
    <a href="#tab-1" data-toggle="tab">
      <span class="bbd">Заявка родителя</span>
    </a>
  </li>
  <li class="semi">
    <a href="#tab-2" data-toggle="tab">
      <span class="bbd">Заявка соискателя</span>
    </a>
  </li>
</ul>

    • 1

相关问题