两次点击之间的差异在这段代码上没有得到很好的体现

Question

我是 javascript 的新手，这就是我问这个问题的原因。如果在按下 "key" 后 9 秒的时间间隔内按下 'hash' 键，我只想要警报 "unlocked"，但它没有按预期工作，有人可以帮助我吗？

document.getElementById("key").addEventListener("click",function(){
alert("enter # to unlock");  
var time = (new Date()).getTime();
  //alert(time);
});

document.getElementById("hash").addEventListener("click",function(){
  var keytime = (new Date()).getTime();
    //alert(keytime);
   var diff = time - keytime;
  alert(diff);
  if(diff <= 9000){
    alert("unlocked");  
  }
  else{
   alert("try again");  
  }
  
  });

<button id="key">key </button>
<button id="hash">#</button>

Answer 1

您在 #key 点击侦听器的范围内初始化了 time。外面是联系不到的。

将其设置为全局变量。

Variable scope documentation

 
var time = 0;

document.getElementById("key").addEventListener("click",function(){
  alert("enter # to unlock");  
  time = (new Date()).getTime();
  //alert(time);
});

document.getElementById("hash").addEventListener("click",function(){
  var keytime = (new Date()).getTime();
    //alert(keytime);
   var diff = time - keytime;
  alert(diff);
  if(diff <= 9000){
    alert("unlocked");  
  }
  else{
   alert("try again");  
  }
  
  });

<button id="key">key </button>
<button id="hash">#</button>

Answer 2

time 应该是一个全局变量，以便 hash 事件侦听器可以访问它。

var time = Infinity;
document.getElementById("key").addEventListener("click",function(){
alert("enter # to unlock");  
time = (new Date()).getTime();
  //alert(time);
});

document.getElementById("hash").addEventListener("click",function(){
  var keytime = (new Date()).getTime();
    //alert(keytime);
   var diff = time - keytime;
  alert(diff);
  if(diff <= 9000){
    time = Infinity;
    alert("unlocked");  
  }
  else{
   alert("try again");  
  }
  
  });

<button id="key">key </button>
<button id="hash">#</button>

Answer 3

时间是一个本地变量。

要在其他函数中访问它，您应该像这样创建一个全局变量：

var time;
document.getElementById("key").addEventListener("click",function(){
alert("enter # to unlock");  
time = (new Date()).getTime();
  //alert(time);
});

document.getElementById("hash").addEventListener("click",function(){
  var keytime = (new Date()).getTime();
    //alert(keytime);
   var diff = time - keytime;
  alert(diff);
  if(diff <= 9000){
    alert("unlocked");  
  }
  else{
  alert("try again");  
 }

  });

两次点击之间的差异在这段代码上没有得到很好的体现

Difference between two clicks didn't get well on this code

javascript

click

addeventlistener