javascript - 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>

我尝试了另一篇文章中提到的东西

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

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

Answer 1

您在点击功能中遗漏了这一点:

showTop.onclick = function() {

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

        showTop.innerHTML = 'Hide';

    } else { 

        showTop.innerHTML = 'Show';

    };