переменная jQuery не изменяется вне функции

Question

Я использую следующий код, чтобы показать боковую панель, когда нажата кнопка sidebar toggle, и скрыть боковую панель при нажатии # страницы.

Показать боковую панель работает идеально, но не скрывается при нажатии # страницы. Похоже, что переменная не установлена ​​в 1, когда был нажат переключатель .sidebar-toggle.

var state = 0; 

if (state === 0) { 
    $('.sidebar-toggle').click(function() { 
     $('#page').animate({marginLeft: '230px'}, 400); 
     state = 1; 
    }); 
} 

if (state === 1) { 
    $('#sidebar').click(function() { 
     $('#page').animate({marginLeft: '0'}, 400); 
     state = 0; 
    }); 
} 

Answer 1

Вы забывали использовать #page click.function ... и лучший способ, чтобы поставить, если внутри click.function ... Попробуйте этот способ

var state = 0; 

$('.sidebar-toggle').click(function() { 
    if (state===0) {  
     $('#page').animate({marginLeft: '230px'}, 400); 
     state = 1; 
    }  
}); 

$('#page').click(function() { 
    if (state===1){ 
     $('#page').animate({marginLeft: '0'}, 400); 
     state = 0; 
    } 
}); 

Answer 2

Может быть потому что это никогда не выполняется

if (state === 1) { 
    $('#sidebar').click(function() { 
     $('#page').animate({marginLeft: '0'}, 400); 
     state = 0; 
    }); 
} 

Попробуйте этот путь -

var state = 0; 
    $('.sidebar-toggle').click(function() { 
     if (state === 0) { 
     $('#page').animate({marginLeft: '230px'}, 400); 
     state = 1; 
     } 
    }); 

    $('#page').click(function() { 
     if (state === 1) { 
     $('#page').animate({marginLeft: '0'}, 400); 
     state = 0; 
     } 
    });