当前位置：文江博客话题详情

连续按两个键可触发 JavaScript 中的事件

发布于 2024-10-08 02:40:52 字数 141 浏览 9 评论 0原文

在 Vim 中，你可以按 gg 转到文档的开头，或者按 dd 删除当前行。如何在网页中实现类似的行为？我的意思是，在网页环境下，如何捕获两个连续的按键事件来触发事件？

谢谢。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

酷炫老祖宗 2024-10-15 02:40:52

您需要监视所有按键事件，并且当您找到可能是多次按键组合中的第一个按键时，启动计时器。如果在计时器处于活动状态时按下组合中的第二个键，则执行某些操作。

例如（伪代码）

//for gg
var inCombo = false;
function KeyPress(Key) {
   if(Key=='g') {
      if(!inCombo) {
          inCombo = true;
          setTimeout('inCombo=false;', 100);
      } else {
          //Do the action here
      }
   }
}

//在此处执行操作，只有在 100 毫秒内按两次 g 时才会触发

You would need to monitor all key press events and when you find a key that is possibly the first in a multi-press combo, start a timer. If the second key in the combo is pressed while the timer is active, do something.

eg (pseudocode)

//for gg
var inCombo = false;
function KeyPress(Key) {
   if(Key=='g') {
      if(!inCombo) {
          inCombo = true;
          setTimeout('inCombo=false;', 100);
      } else {
          //Do the action here
      }
   }
}

The //Do the action here, will only fire if g is pressed twice within 100ms

回复收藏 0 原文

七七 2024-10-15 02:40:52

你不能。只需注册普通按键事件并将按键推送到数组即可。

现在您可以调用一个检查命令的函数：

 // More or less pseudo code
 function deleteLine(){};
 function copyLine(){};      

 var commands = {'dd': deleteLine, 'yy': copyLine};    

 function onKeyPress(e) {
     keyList.push(e.key);

     // in this example keyList = ['d', 'y', 'i', 'd', 'd']
     var result = handleEvent();
 }

 function handleEvent(keyList) {
      // more pseudo code follows

      var cmds = commands.keyValue.sortByLengthDescending();
      for(var c in cmds) {

          // match the keys
          var ckey = c.split('');
          for(var i = keyList.length; i >= 0; i--) {
              if (keyList[i] !== ckey.shift()) {
                  break;
              }
              if (ckey.length === 0) {
                  return commands[c]();
              }
          }
      }
 }

这很简单，干净（取决于您编写的方式）并且可扩展，添加更多命令非常容易，当然您可以更改它以便可以将参数传递给命令功能等

You can't. Simply register the normal key event and push the keys to an array.

Now you can call a function which checks for the commands:

 // More or less pseudo code
 function deleteLine(){};
 function copyLine(){};      

 var commands = {'dd': deleteLine, 'yy': copyLine};    

 function onKeyPress(e) {
     keyList.push(e.key);

     // in this example keyList = ['d', 'y', 'i', 'd', 'd']
     var result = handleEvent();
 }

 function handleEvent(keyList) {
      // more pseudo code follows

      var cmds = commands.keyValue.sortByLengthDescending();
      for(var c in cmds) {

          // match the keys
          var ckey = c.split('');
          for(var i = keyList.length; i >= 0; i--) {
              if (keyList[i] !== ckey.shift()) {
                  break;
              }
              if (ckey.length === 0) {
                  return commands[c]();
              }
          }
      }
 }

This is simple, clean (depends on how exactly you write it) and scalable, adding more commands is pretty easy, of course you change it so that you can pass parameters to the command function etc.

回复收藏 0 原文

~没有更多了~