如何使用纯JS或jQuery检测转义按键？

7 回答

• 29

  注意： keyCode 是getting deprecated而是使用 key .

  function keyPress (e) {
      if(e.key === "Escape") {
          // write your logic here.
      }
  }
  

  这是jsfiddle

  ---

  keyCode 已弃用

  看起来keydown和keyup工作，即使按键可能没有

  ---

  $(document).keyup(function(e) {
       if (e.key === "Escape") { // escape key maps to keycode `27`
          // <DO YOUR WORK HERE>
      }
  });
  

  Which keycode for escape key with jQuery

  回复于 2024-04-30T21:28:30+08:00
• 15

  最好的办法就是为此做好准备

  FUNCTION:

  $.fn.escape = function (callback) {
      return this.each(function () {
          $(document).on("keydown", this, function (e) {
              var keycode = ((typeof e.keyCode !='undefined' && e.keyCode) ? e.keyCode : e.which);
              if (keycode === 27) {
                  callback.call(this, e);
              };
          });
      });
  };
  

  EXAMPLE:

  $("#my-div").escape(function () {
      alert('Escape!');
  })
  

  回复于 2024-04-30T21:28:30+08:00
• 171

  我认为最简单的方法是vanilla javascript：

  document.onkeyup = function(event) {
     if (event.key === 27){
       //do something here
     }
  }
  

  回复于 2024-04-30T21:28:30+08:00
• 6

  keydown 事件适用于Escape，并且允许您在所有浏览器中使用 keyCode . 此外，您需要将侦听器附加到 document 而不是正文 .

  UPDATE May 2016

  keyCode 现在正在被弃用，大多数现代浏览器现在提供key属性，尽管你支持它 .

  所有现代浏览器现在都支持 UPDATE September 2018 evt.key .

  document.onkeydown = function(evt) {
      evt = evt || window.event;
      var isEscape = false;
      if ("key" in evt) {
          isEscape = (evt.key == "Escape" || evt.key == "Esc");
      } else {
          isEscape = (evt.keyCode == 27);
      }
      if (isEscape) {
          alert("Escape");
      }
  };
  

  Click me
  

  回复于 2024-04-30T21:28:30+08:00
• 830

  检查 keyCode && which ＆ keyup || keydown

  $(document).keydown(function(e){
     var code = e.keyCode || e.which;
     alert(code);
  });
  

  回复于 2024-04-30T21:28:30+08:00
• 2

  下面的代码不仅禁用了ESC键，还检查了按下它的条件，根据情况，它将执行或不执行操作 .

  在这个例子中，

  e.preventDefault();
  

  将禁用ESC按键操作 .

  您可以做任何类似隐藏div的事情：

  document.getElementById('myDivId').style.display = 'none';
  

  按下ESC键的地方也被考虑在内：

  (e.target.nodeName=='BODY')
  

  如果你想向所有人申请，你可以删除这个条件部分 . 或者您可以将INPUT定位到此处仅在光标位于输入框中时应用此操作 .

  window.addEventListener('keydown', function(e){
      if((e.key=='Escape'||e.key=='Esc'||e.keyCode==27) && (e.target.nodeName=='BODY')){
          e.preventDefault();
          return false;
      }
  }, true);
  

  回复于 2024-04-30T21:28:30+08:00
• 6

  使用JavaScript你可以检查工作 jsfiddle

  document.onkeydown = function(evt) {
      evt = evt || window.event;
      if (evt.keyCode == 27) {
          alert('Esc key pressed.');
      }
  };
  

  使用jQuery你可以检查工作 jsfiddle

  jQuery(document).on('keyup',function(evt) {
      if (evt.keyCode == 27) {
         alert('Esc key pressed.');
      }
  });
  

  回复于 2024-04-30T21:28:30+08:00