Переменная Javascript сама меняет значение
Итак, я пишу код для своей веб-страницы, что если у вас открыто одно из двух окон (регистрация, вход в систему), вы не можете открыть другой. Я застрял со следующей проблемой: как только вы закроете окно, нажав кнопку мыши из коробки, значение изменится на 1, и вы сможете снова открыть окно, но внезапно оно устанавливается на 0, и вы можете Я больше не открываю коробку.
ЕСЛИ вы закроете коробку с помощью кнопки ЗАКРЫТЬ, вы МОЖЕТЕ открыть коробку снова, но не нажатием за пределами коробки.
В начале файла JS я объявляю var openable и устанавливаю значение 1.
var openable = 1;
Код для закрытия кнопкой ЗАКРЫТЬ:
$("#closeReg").click(function(){
openable = 1;
console.info(openable);
$('#register').css('display','none');
$("#register").siblings().css("opacity", "1");
});
Код для прессования из коробки:
var subject = $("#register");
if (e.target.id == subject.attr('id')){
subject.fadeOut();
subject.siblings().css("opacity", "1");
openable = 1;
console.info(openable);
}
Код для открытия коробки:
$("#regButton").click(function(){
console.info(openable);
if (openable == 1){
$("#register").fadeIn();
$("#register").siblings().css("opacity", "0.5");
openable = 0;
console.info(openable);
}
});
Весь код: https://pastebin.com/vC461VGy
Я регистрирую значение openable в функции regbutton.click перед IF, и в нем написано ZERO
Лучше поместить его в Fiddle / Codepen, чтобы его можно было запускать, а не просто просматривать.
Или, что еще лучше, опубликуйте его в фрагменте кода SO ...
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
var openable = 1;
$("#closeReg").click(function() {
openable = 1;
console.info(openable);
$('#register').css('display', 'none');
$("#register").siblings().css("opacity", "1");
});
$("#regButton").click(function() {
console.info(openable);
if (openable == 1) {
$("#register").fadeIn();
$("#register").siblings().css("opacity", "0.5");
openable = 0;
console.info(openable);
}
});
$('body').click(function(e) {
if ($(e.target).closest('#register').length <= 0 && !$(e.target).is('#closeReg') && !$(e.target).is('#regButton')) {
$('#closeReg').trigger('click');
}
});#register {
background-color: #FFAAAA;
}
body {
height: 200px
}<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id = "closeReg">Close</button>
<button id = "regButton">Open</button>
<div id = "register">
register box
</div>Вот попробуйте этот образец.
Ваш код для сокрытия при нажатии снаружи работал некорректно, в основном потому, что e не определено, и даже если мы считаем, что это событие щелчка, ваш тест был неправильным.
Основная трудность заключается в том, чтобы обнаружить щелчок за пределами поля, не обнаруживая щелчка, который его открывает, иначе вы в конечном итоге откроете и закроете одновременно. Поэтому я добавил два теста, чтобы убедиться, что цели не являются кнопками, которые обрабатывают определенное поведение.
Кроме того, вместо того, чтобы дублировать код для закрытия модального окна, я сделал так, чтобы при щелчке в любом месте он запускал нажатие кнопки закрытия, таким образом, только одно событие должно обновляться. Обратите внимание, что это также можно сделать, создав ваше собственное событие, но ...
Это не работает, кнопка закрытия не срабатывает при нажатии из поля регистрации, а кнопка регистрации не нажимается легко, только после нескольких попыток.
Причина описанной проблемы не проиллюстрирована в опубликованном вами коде. Вы уверены, что значение
openableравно 0? Или вы просто предполагаете это на том основании, что условие (или какая-то его часть) не срабатывает?