启动/停止按键事件jquery

Start / Stop keypress event jquery

本文关键字:事件 jquery 启动      更新时间:2024-02-10

我有个问题。我想在按下空格时停止按键事件,然后我想做点什么,最后我需要"重新启动"这个功能。有可能吗?我该怎么做?

提前感谢

$(document).keypress(function(e) {
     if(e.keyCode == 32)
          // stop keypress function
          // do something
          // restart keypress function
}

我相信您有两个选择。

禁用处理程序:

$(document).on('keypress', function keypressHandler(e) {
    //disable handler
    $(document).off('keypress');
    //do stuff
    //enable keypress handler
    $(document).on('keypress', keypressHandler);    
});

使用标志:

var keyHandlerActive = true;
$(document).on('keypress', function(e) {
    if (!keyHandlerActive) { return; }
    keyHandlerActive = false;
    //do stuff
    keyHandlerActive = true;    
});

尝试以下函数之一:

e.stopPropagation();

e.preventDefault();

完整代码:

$(document).keypress(function(e) {
  if (e.keyCode == 32) {
    e.preventDefault(); // e.stopPropagation();
  }
})

您的关闭条件是空格,但没有提到重新打开条件。。所以我使用下面的计时器。。根据您的喜好更改

要尝试演示,

  1. 键入除空格以外的任何键以查看其记录
  2. 按空格键关闭10秒钟(或更改代码使其关闭,直到过程完成)
  3. 功能在10秒钟后打开

当按下空格时,该函数只需关闭(逻辑关闭,因为如果过度使用,绑定/重新绑定可能会很痛苦)10秒钟。

var logicalOff = false;
$(document).keypress(function(e) {
     if (logicalOff) { return true; } //well we just ignore and return until turned On
     $('div').text(e.which);
     if(e.which == 32) {
       logicalOff = true; // stop keypress function
       setTimeout(function () { // restart keypress function
         logicalOff = false;
         $('div').text("turned on now");
       }, 10000);          
       $('div').text("turned off for 10 seconds");
     }     
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>

好吧,你可以这样玩它,因为我为这两种情况都添加了两个按钮,默认情况下SPACE将被禁用。请查看:

HTML

<input id="myinput" type="text">
<input id="space_flag" type="hidden" value="0">
<br/>
<input id="enable_space" type="button" value="Enable Space">
<br/>
<input id="disable_space" type="button" value="Disable Space">

JQuery

$(function(){
    $("#myinput").keypress(function(event){        
        if(event.keyCode == 32 && $("#space_flag").val()==0){
            return false;        
        }
    });
    $("#enable_space").click(function(event){
        $("#space_flag").val(1);
    });
    $("#disable_space").click(function(event){
        $("#space_flag").val(0);
    });
});

工作示例http://jsfiddle.net/1pn4cLak/