显示/隐藏内容

伦迪·朱维（Rendy Juvi）

我需要有关toogle功能的帮助。如何更改名称，例如：当“框”显示时仅显示SHOW，而当“框”隐藏时则仅显示HIDE。

现在，“显示/隐藏”将同时显示在“显示”和“隐藏”上。

  
$(document).ready(function(){
    $(".show").click(function(){
        $(".apaansi").toggle();
    });
});

.box {
  border:1px solid #dedede;
  padding:1%;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="uniquename">
  
  <div class="apaansi">
  
    <div class="box col-lg-12 col-md-12 col-sm-12 col-xs-12"> Search </div>
  
  </div>
  
   
  <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<a href="#" class="show show-car"> Show / Hide <i class="fa fa-chevron-down"></i> </a>
</div>
  
</div>

黄腾腾

您可以为此简单地使用一个计数器。

这是一个小提琴：https : //jsfiddle.net/LL5xhapL/

   $counter = 0;
   $(".show").click(function(){
        if($counter % 2)
        {
          $(this).html('Hide <i class="fa fa-chevron-down"></i>');
        }else{
          $(this).html('Show <i class="fa fa-chevron-right"></i>');
          $counter = 0;
        }
        $counter++;
        $(".apaansi").toggle();
    });

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。