JavaScript:隐藏和显示菜单类

JavaScript: Hide and Show Menu Class

本文关键字:菜单 显示 隐藏 JavaScript      更新时间:2023-09-26
var Menu = function() {
    state = 0;
}
Menu.prototype.click = function() {
    if (this.state == 1) {
        $(document).ready(function(){
            $("#collapse-menu").click(function(){
                $("#list-navbar").show(500);
                this.state = 0;
            });
        });
    } else {
        $(document).ready(function(){
            $("#collapse-menu").click(function(){
                $("#list-navbar").hide(500);
                this.state = 1;
            });
        });
    }
}

如何在页面加载时实例化类,并仅调用函数click onclick 事件,从而保持类实例化?

var Menu = function() {
  this.state = 0;
};
Menu.prototype.click = function() {
  var that = this;   // our Menu object
  $("#collapse-menu").click(function(){
    that.state ^= 1; // Toggles 1,0,1... values
    $("#list-navbar")[that.state?"hide":"show"](500);
  });
};

jQuery(function( $ ) { // DOM ready here
  var m = new Menu();  // New Menu instance
  m.click();           // init clicks on #collapse-menu
});

jsBin 演示

关于^作为切换器:https://stackoverflow.com/a/22061240/383904