Javascript – 检查是否在5秒内按下了两次键

我想检查是否在5秒内按下了Enter键两次并执行一些操作。 如何在给定时间内检查按键是否被按下一次或两次并执行不同的操作。

这是我的代码：

0
 
 0  $(document).keypress(function(e) { if(e.which == 13){ var element = $("#log"); var timeDifference = 0; //Log the timestamp after pressing Enter $("#enteredTime").text(new Date().getTime()); //Check if enter was pressed earlier if ($("#enteredTime").text() !== "0") { var now = new Date().getTime(); var previous = $("#enteredTime").text(); difference = now - previous; } //Check if enter was pressed only once within 5 secs or more if(){ $("#log").text("Once"); $("#enteredTime").text("0"); //Check if enter was pressed twice in 5 secs }else{ $("#log").text("Twice in less than 5 secs"); $("#enteredTime").text("0"); } } });  

http://jsfiddle.net/Rjr4g/

谢谢！

Answer 1

就像是

 var start=0; $(document).keyup(function(e) { if(e.keyCode == 13) { elapsed = new Date().getTime(); if(elapsed-start<=5000){ //do something; } else{ //do something else; } start=elapsed; } }); 

Answer 2

尝试基于计时器的解决方案

 var flag = false, timer; $(document).keypress(function (e) { var element = $("#log"); var timeDifference = 0; if (e.which == 13) { if (flag) { console.log('second'); clearTimeout(timer); flag = false; } else { console.log('first'); flag = true; timer = setTimeout(function () { flag = false; console.log('timeout') }, 5000); } //Log the timestamp after pressing Enter $("#enteredTime").text(new Date().getTime()); if ($("#enteredTime").text() !== "0") { var now = new Date().getTime(); var previous = $("#enteredTime").text(); difference = now - previous; } } }); 

演示： 小提琴

Answer 3

Bacon.js似乎是表达这一点的好工具。

 $(document).asEventStream('keypress') .filter(function (x) { return x.keyCode == 13; }) .map(function () { return new Date().getTime(); }) .slidingWindow(2, 1) .map(function (x) { return (x.length == 1 || x[1] - x[0] > 5000) ? 1 : 2; }) .onValue(function (x) { $("#log").text(x == 1 ? "Once" : "Twice in less than 5 secs"); }); 

（小提琴）

Answer 4

这是我的解决方案，请检查它是否符合您的想法:)

 (function($){ var element = $("#log"); var timeDifference = 0; var count = 0; $(document).keypress(function(e) { if(e.which === 13){ //do what you want when enterpress 1st time /*blah blah */ //after done 1st click count++; if(count === 2) { //do what you want when enterpress 2nd time in 5 seconds /* blah blah */ //after done clearTimeout(watcher); count = 0; return; } //setTimeout to reset count if more than 5 seconds. var watcher = setTimeout( function() { count = 0; },5000); } }); }(jQuery) 

Answer 5

检查更新的小提琴

 var count = 0; $(document).keypress(function(e) { var element = $("#log"); var timeDifference = 0; if(e.which == 13){ count++; console.log('enter pressed'+count); if(count == 1){ startTimer(); } else{ checkCount(); } //Log the timestamp after pressing Enter $("#enteredTime").text(new Date().getTime()); if ($("#enteredTime").text() !== "0") { var now = new Date().getTime(); var previous = $("#enteredTime").text(); difference = now - previous; } } }); function startTimer(){ setTimeout(checkCount,5000); } function checkCount(){ if(count == 1){ $("#log").text("Once"); $("#enteredTime").text("0"); //Check if enter was pressed twice in 5 secs }else{ $("#log").text("Twice in less than 5 secs"); $("#enteredTime").text("0"); } } 

---

startTimer()开始计数， 先按回车键 。 checkCount()包含5secs后的条件。

setTimeout（）允许您附加在特定时间跨度之后发生的事件。