Question

我有这个脚本将汉堡包菜单按钮从行更改为x点击.....我已经设置了一个简单的标志来改变它的id并认为这可以做得更好......

我要做的是检查菜单的状态，并以X（活动）或3行的形式获得“相应地采取行动”的按钮......这是我的代码

document.querySelector( '.nav-toggle' )
  .addEventListener( "click", function() {
    this.classList.toggle( "active" );

  })

var toggle = function (funcA, funcB) {
    return function () {
        var flag = true;
        if (flag) {
            funcA();
        } else {
            funcB();
        }
        flag = !flag;
    };
};
$('.nav-toggle').click(toggle (function (){
    $('#menu').multilevelpushmenu( 'collapse' );
}, function (){
    $('#menu').multilevelpushmenu( 'expand' );
}));

这里是按钮的html ....

<p><a class="nav-toggle" href="#"><span></span></a>Menu</p>

...我知道它应该相对简单，但我不能让它起作用....我正在尝试这个.......

$(document).ready(function() {
  $(".nav-toggle").toggle(
     function () {
         $( '#menu' ).multilevelpushmenu( 'expand' );
     },
     function () {
        $( '#menu' ).multilevelpushmenu( 'collapse' );
     },

   );

}）;

但这不起作用。任何帮助高度赞赏。

Answer 1

尝试将toggle电话移至click事件handler功能

$(document).ready(function () {

    $('#menu').multilevelpushmenu({
        onMenuSwipe: function () {
            var e = arguments[0];
            if ($(e.target).prop('tagName').toLowerCase() == 'input') return false;
        }
    });

    var toggle = function (funcA, funcB) {
        return function () {
            var flag = true;
            if (flag) {
                funcA();
            } else {
                funcB();
            }
            flag = !flag;
        };
    };

    $('.nav-toggle').click(function () {
        toggle(function () {
            $('#menu').multilevelpushmenu('collapse');
        }, function () {
            $('#menu').multilevelpushmenu('expand');
        })
    });
});

document.querySelector('.nav-toggle')
    .addEventListener("click", function () {
    this.classList.toggle("active");

});

jsfiddle http://jsfiddle.net/c5EA4/256/

jQuery Button函数监听菜单打开/关闭状态改变状态

1 个答案: