javascript - jQuery var不输入功能

当我按菜单切换时，我需要一个元素来切换，然后当我在页面上的任意位置（在包装元素上）按时，我需要它再次切换。

这是我的代码：

var bodyclick = 0;
console.log(bodyclick);

//If you clicks the menu toggle, then activate toggle and bodyclick should be 1
$("#menu-toggle").click(function(e) {
    e.preventDefault();
    $("#wrapper").toggleClass("toggled");
    bodyclick = 1;
    console.log(bodyclick);
});

//Now, that the bodyclick is 1, user should click anywhere on the wrapper to activate the toggle again
if (bodyclick === 1) {
    console.log("The wrapper is toggled");
    $("#wrapper").click(function(e) {
        //e.preventDefault();
        $("#wrapper").toggleClass("toggled");
        bodyclick = 0;
    });
}

当用户单击＃menu-toggle元素时，包装器应切换，而bodyclick var应为1。

现在第二个功能应该起作用了。如果用户在#wrapper上单击ANYWHERE，则应再次切换它，并将bodyclick改回0。

由于某些原因，此方法不起作用。它不会启动if语句。控制台日志显示bodyclick为1，但if不起作用。

我尝试使用==，但它没有任何改变。为什么不行呢？

编辑
添加@Nikhil Aggarwal后，答案：

var bodyclick = 0;
console.log(bodyclick);


$("#menu-toggle").click(function (e) {
    e.preventDefault();
    $("#wrapper").toggleClass("toggled");
    bodyclick = 1;
    console.log(bodyclick);
});

$("#wrapper").click(function(e) {
    if (bodyclick === 1) {
        console.log("The wrapper is toggled");
       //e.preventDefault();
       $("#wrapper").toggleClass("toggled");
       bodyclick = 0;
    }
});

切换功能适用于＃menu-toggle，甚至可以将bodyclick设置为1。

但是，当我现在单击包装器的任何位置时（在＃menu-toggle切换之后），它都不会切换元素或将bodyclick值更改回零。

我为此表示歉意，但我只是看不到逻辑。

已修正，感谢@Nikhil Aggarwal：
只需在＃menu-toggle函数中添加e.stopPropagation();。

最佳答案

更新您的代码以关注

$("#wrapper").click(function(e) {
    if (bodyclick === 1) {
        console.log("The wrapper is toggled");
       //e.preventDefault();
       $("#wrapper").toggleClass("toggled");
       bodyclick = 0;
    }
});

原因-加载时，bodyclick的值为0，因此，从不执行if条件，这也意味着绑定从未发生。因此，您应该在事件处理程序内部移动条件，以便事件处理程序在加载时存在，并根据需要有条件地执行。

关于javascript - jQuery var不输入功能，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50272472/