jquery 菜单滑动和更改按钮文本

Question

好的，所以我使用这里的幻灯片菜单 slide menu 我想在点击它时更改按钮文本以显示或隐藏，例如，这是我目前只有顶部菜单的代码在我的离线安装中

<button id="showTop" class="menubtn" data-text-swap="Show">Show</button>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="js/modernizr.js"></script>
<script src="js/classie.js"></script>
  <script>
   var menuTop = document.getElementById( 'cbp-spmenu-s3' ),
    showTop = document.getElementById( 'showTop' ),
    body = document.body;

  
   showTop.onclick = function() {
    
    classie.toggle( this, 'active1' );
    classie.toggle( menuTop, 'cbp-spmenu-open' );
    disableOther( 'showTop' );
   };
   

   function disableOther( button ) {

    if( button !== 'showTop' ) {
     classie.toggle( showTop, 'disabled' );
    }

   }
   
  </script>

我尝试了另一个 post

中提到的内容

$('.SeeMore2').click(function(){
    var $this = $(this);
    $this.toggleClass('SeeMore2');
    if($this.hasClass('SeeMore2')){
        $this.text('See More');         
    } else {
        $this.text('See Less');
    }
});

但这并没有帮助所以我可以对 showTop.onclick 函数下的第一个脚本做些什么来改变按钮文本而不仅仅是 class。

Answer 1

您在点击功能中遗漏了这个：

showTop.onclick = function() {

    if (showTop.innerHTML == 'Show') {

        showTop.innerHTML = 'Hide';

    } else { 

        showTop.innerHTML = 'Show';

    };

jquery 菜单滑动和更改按钮文本

jquery menu slide and change button text

javascript

jquery

css

drop-down-menu

jquery-animate