Question

所以，我正在为我的网页编写一个代码，如果你打开两个方框中的一个（注册，登录），你就无法打开另一个。我遇到了以下问题：一旦你从框中按下鼠标关闭盒子，值就会变为1而你应该能够再次打开盒子，但突然之间它会将自己设置为0并且你可以不再打开盒子了。

如果您使用CLOSE按钮关闭此框，您可以再次打开该框，但不能在框外按下。

在JS文件的开头，我声明var openable并将value设置为1.

var openable = 1;

使用CLOSE按钮关闭代码：

$("#closeReg").click(function(){
    openable = 1;
    console.log(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.log(openable);  
}

打开方框的代码：

$("#regButton").click(function(){
    console.log(openable);
    if(openable == 1){
    $("#register").fadeIn();
    $("#register").siblings().css("opacity", "0.5");
    openable = 0;
    console.log(openable);
    }
});

整码： https://pastebin.com/vC461VGy

Answer 1

＆＃13;

var openable = 1;


$("#closeReg").click(function() {
  openable = 1;
  console.log(openable);
  $('#register').css('display', 'none');
  $("#register").siblings().css("opacity", "1");
});


$("#regButton").click(function() {
  console.log(openable);
  if (openable == 1) {
    $("#register").fadeIn();
    $("#register").siblings().css("opacity", "0.5");
    openable = 0;
    console.log(openable);
  }
});

$('body').click(function(e) {
  if ($(e.target).closest('#register').length <= 0 && !$(e.target).is('#closeReg') && !$(e.target).is('#regButton')) {
    $('#closeReg').trigger('click');
  }
});

＆＃13;

#register {
  background-color: #FFAAAA;
}

body {
  height: 200px
}

＆＃13;

<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>

＆＃13;

在这里，试试这个样本。

您在外部点击时隐藏的代码无法正常工作，主要是因为e未定义，即使我们认为它是点击事件，您的测试也是错误的。

主要的难点是检测到框外的点击而没有检测到打开它的点击，或者您最终会同时打开和关闭。因此，为什么我添加了两个测试以确保目标不是处理特定行为的按钮。

此外，我没有将代码加倍以关闭模式，而是当你点击任意位置时，它会触发点击关闭按钮，这样只有一个事件要保持最新。请注意，这也可以通过创建自己的事件来实现，但是meh ......

Javascript变量本身会改变值

1 个答案: