Question

我正在制作一个html页面的故事，你可以通过按“t”来激怒叙述者。他说：“我敢打赌，如果不按t，你就不能整整5秒钟。”

任何人都知道如何检查按钮是否在5秒内没有被点击，如果点击它也会发生其他事情。

我尝试使用秒来解决这个问题，因为我对JavaScript很陌生，目前正在研究这个问题。

  function timenow() {
    var now = today.getSeconds();
  }
  function timelater() {
    var later = today.getSeconds();
  }



  function clicked() {
    if (!document.getElementById("form-search") && document.getElementById("fake-search").value == "t") {
      if (a==8) {
        alert("Alright Smart Guy, lets just delete everything on the page!");
        document.body.style.opacity = "0";
        document.getElementById("google_search").style.cursor= "wait";
        a+=1;
      }
      else if (a==9) {
        alert("You know what... I'm done, I'm Done! If you can not press t for 5 seconds, I'll give you everything back.");
        a+=1;
        timenow();
        setTimeout(timelater(), 5000);
        console.log(now);
        console.log(later);
      }
    else {
      null;
    }

Answer 1

首先，只要显示按钮，就会使用setTimeout()来启动计时器（在这种情况下，在页面加载时）。其次，我们将使用onClick在按下按钮时调用函数。如果按下该按钮，我们会调用clearTimeout()，以便超时代码不会运行。如果未按下该按钮，则超时将到期，超时代码将运行。

＆＃13;

//first we define what happens when the button is not pressed in time.
function notPressed() {
  alert("You didn't press the button!!!");
}

//next we define what happens if the button IS pressed in time.
function pressed() {
  alert("You pressed the button!");
  //Here we must clear the timer or it will run even after the button is pressed!
  clearTimeout(btnTimer); 
}

//finally we start the timer.  We specify the time using milliseconds in the second parameter.
var btnTimer = window.setTimeout(notPressed,5000);

＆＃13;

<input type="button" onClick="pressed()" value="Click me" />

＆＃13;

Answer 2

您首先为计时器创建一个占位符，然后通过单击事件处理程序对其进行初始化。在5秒之间的任何时间，如果计时器仍在运行，您可以检查按键t是否已被按下和。在该条件中，您提供了进一步的功能。

更新：要为keyup和keypress事件分配相同的功能，只需将回调提取到其＆＃39;拥有函数detectKey并将该函数传递给两个事件处理程序：

＆＃13;

let timer;

document.querySelector('.start').addEventListener('click', () => {
  timer = setTimeout(() => {
    alert("Time's up! You didn't press the letter");
  }, 5000);
});

document.addEventListener('keyup', detectKey);

document.addEventListener('keypress', detectKey);

function detectKey(e) {
  const key = String.fromCharCode(e.keyCode).toLowerCase() === 't';
  
  if (key && timer) {
    clearTimeout(timer);
    
    timer = null;
        
    alert('You pressed the letter!');    
  }
}

＆＃13;

<button class="start">Start</button>

＆＃13;

如何检查是否在一定时间内没有点击按钮（Javascript）

2 个答案: