source

jQuery를 사용하는 이스케이프 키의 키 코드

factcode 2023. 1. 29. 20:17
반응형

jQuery를 사용하는 이스케이프 키의 키 코드

저는 두 가지 기능이 있습니다.Enter 키를 누르면 기능이 올바르게 실행되지만 이스케이프를 누르면 실행되지 않습니다.탈출키는 몇 번이 맞습니까?

$(document).keypress(function(e) { 
    if (e.which == 13) $('.save').click();   // enter (works as expected)
    if (e.which == 27) $('.cancel').click(); // esc   (does not work)
});

키업 이벤트를 사용해 보겠습니다.

$(document).on('keyup', function(e) {
  if (e.key == "Enter") $('.save').click();
  if (e.key == "Escape") $('.cancel').click();
});

함수의 키코드 값을 하드코드하지 말고 이름 있는 상수를 사용하여 의미를 더 잘 전달하는 것이 좋습니다.

var KEYCODE_ENTER = 13;
var KEYCODE_ESC = 27;

$(document).keyup(function(e) {
  if (e.keyCode == KEYCODE_ENTER) $('.save').click();
  if (e.keyCode == KEYCODE_ESC) $('.cancel').click();
});

일부 브라우저(FireFox 등, 다른 브라우저는 확실하지 않음)는 글로벌하게 정의한다.KeyEvent이러한 유형의 상수를 공개하는 객체입니다.이 SO 질문은 다른 브라우저에서도 해당 개체를 정의하는 좋은 방법을 보여줍니다.

(이전 코멘트에서 발췌한 답변)

를 사용해야 합니다.keyup보다는keypress예:

$(document).keyup(function(e) {
  if (e.which == 13) $('.save').click();     // enter
  if (e.which == 27) $('.cancel').click();   // esc
});

keypress브라우저 간에 일관되게 처리되지 않는 것 같습니다(IE와 Chrome과 Firefox의 http://api.jquery.com/keypress에서 데모를 사용해 보십시오).가끔씩keypress는 등록되지 않습니다.또, 「which」와 「keyCode」의 양쪽 모두의 값이 다릅니다).keyup일관성이 있습니다.

에 대한 논의가 있었으므로e.whiche.keyCode: 주의:e.which는 jquery 정규화된 값으로 사용을 권장합니다.

이벤트.속성을 통해 이벤트가 정규화됩니다.keyCode 및 event.charCode.이벤트 관람을 권장합니다.키보드 키 입력에 사용됩니다.

(http://api.jquery.com/event.which/)에서 입수).

임의의 키의 키 코드를 검색하려면 , 다음의 간단한 기능을 사용합니다.

document.onkeydown = function(evt) {
    console.log(evt.keyCode);
}

27이스케이프 키의 코드입니다.:)

가장 좋은 방법은

$(document).keyup(function(e) { 
    if (e.which === 13) $('.save').click();   // enter 
    if (e.which === 27) $('.cancel').click(); // esc   

    /* OPTIONAL: Only if you want other elements to ignore event */
    e.preventDefault();
    e.stopPropagation();
});

요약

  • which보다 바람직하다keyCode정규화되어 있기 때문에
  • keyup보다 바람직하다keydown사용자가 키를 계속 누르고 있으면 여러 번 키가 다운될 수 있기 때문입니다.
  • 사용 안 함keypress실제 캐릭터를 캡처하고 싶지 않은 경우.

흥미롭게도 부트스트랩은 드롭다운컴포넌트에 keydown과 keyCode를 사용합니다(3.0.2 기준).아마 그곳에서는 별로 좋지 않은 선택일 것 같아요.

JQuery 문서의 관련 스니펫

브라우저는 이 정보를 저장하기 위해 다른 속성을 사용하는 반면, jQuery는 .which 속성을 정규화하여 키 코드를 확실하게 가져올 수 있도록 합니다.이 코드는 화살표 등의 특수 키 코드를 포함하여 키보드의 키에 해당합니다.실제 텍스트 엔트리를 캡처하려면 .keypress()를 사용하는 것이 좋습니다.

기타 관심 항목: JavaScript Keypress 라이브러리

jEscape 플러그인 사용(Google 드라이브에서 다운로드)

$(document).escape(function() { 
   alert('ESC button pressed'); 
});

또는 크로스 브라우저의 키 코드를 가져옵니다.

var code = (e.keyCode ? e.keyCode : e.which);
if (code === 27) alert('ESC');
if (code === 13) alert('ENTER');

스위치를 사용할 수 있습니다.

var code = (e.keyCode ? e.keyCode : e.which);
switch (code) {
    case 27:
       alert('ESC');
       break;
     case 13:
       alert('ENTER');
       break;
}

MDN에서 사용되지 않는 것으로 간주되는 최신 답변을 게시하는 것 뿐입니다.

오히려 모든 것에 대해 깨끗한 이름을 지원하는 것을 선택해야 합니다.여기 복사 파스타가 있습니다.

window.addEventListener("keydown", function (event) {
  if (event.defaultPrevented) {
    return; // Do nothing if the event was already processed
  }

  switch (event.key) {
    case "ArrowDown":
      // Do something for "down arrow" key press.
      break;
    case "ArrowUp":
      // Do something for "up arrow" key press.
      break;
    case "ArrowLeft":
      // Do something for "left arrow" key press.
      break;
    case "ArrowRight":
      // Do something for "right arrow" key press.
      break;
    case "Enter":
      // Do something for "enter" or "return" key press.
      break;
    case "Escape":
      // Do something for "esc" key press.
      break;
    default:
      return; // Quit when this doesn't handle the key event.
  }

  // Cancel the default action to avoid it being handled twice
  event.preventDefault();
}, true);

당신의 코드는 잘 작동합니다.창문에 초점이 안 맞았을 가능성이 큽니다.iframe box 등을 닫을 때도 같은 기능을 사용하고 있습니다.

$(document).ready(function(){

    // Set focus
    setTimeout('window.focus()',1000);

});

$(document).keypress(function(e) {

    // Enable esc
    if (e.keyCode == 27) {
      parent.document.getElementById('iframediv').style.display='none';
      parent.document.getElementById('iframe').src='/views/view.empty.black.html';
    }

});

나도 똑같은 일을 하려고 했는데 그게 날 짜증나게 했어.파이어폭스에서는 에스케이프 키를 눌렀을 때 몇 가지 작업을 시도하면 에스케이프 키 처리가 계속되며, 그 후 실행하려던 작업이 취소됩니다.경보는 정상적으로 동작합니다.하지만 저 같은 경우에는 통하지 않는 역사로 돌아가고 싶었습니다.드디어 아래와 같이 이벤트의 전파를 강제로 정지시켜야 한다는 것을 알게 되었습니다.

if (keyCode == 27)
{
    history.back();

    if (window.event)
    {
        // IE works fine anyways so this isn't really needed
        e.cancelBubble = true;
        e.returnValue = false;
    }
    else if (e.stopPropagation)
    {
        // In firefox, this is what keeps the escape key from canceling the history.back()
        e.stopPropagation();
        e.preventDefault();
    }

    return (false);
}

않은 하자면, 는 '먹다'를 한다는 것입니다.문제는 다음 명령어를 사용하는 것입니다.keypress.

, 사사 perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhaps perhapskeypress라고 하는 은 불타오르다.when an actualcharacteris being inserted★★★★★★ 。
것은 ★★★★★★★★★★★★★★★★★★★★★★★★.keydown/keyup.the user depresses a키보드 위에 있는 것들key.

차이가 나타나는 이유는 다음과 같습니다.esc는 제어 문자('비문자')이므로 텍스트를 쓰지 않기 때문에 실행조차 하지 않습니다.keypress.
enter 문자는 를 제어하기 로 사용하고 행 하고 있기 (UI)가 합니다.keypress.

출처 : quirks 모드

모든 문자의 16진수 코드를 얻으려면 http://asciitable.com/ 를 방문하십시오.

입력된 키보드 입력 및 키 조합을 캡처하기 위한 강력한 Javascript 라이브러리입니다.종속성이 없습니다.

http://jaywcjlove.github.io/hotkeys/

hotkeys('enter,esc', function(event,handler){
    switch(handler.key){
        case "enter":$('.save').click();break;
        case "esc":$('.cancel').click();break;
    }
});

단축키는 , shiftoptionaltctrlcontrolcommand및 의 수식자를 이해하고 있습니다.

다음f1 특수 키는 단축키에 사용할f19 수 있습니다:backspacetabclearenterreturnescescapespaceupdownleftrighthomeendpageuppagedowndeldelete ........................................

나는 항상 키업과 e를 사용해 왔다.어떤 탈출 키를 잡을지.

이 질문이 jquery에 대한 질문인 것은 알지만 jqueryui를 사용하는 사람들에게는 많은 키코드에 상수가 있습니다.

$.ui.keyCode.ESCAPE

http://api.jqueryui.com/jQuery.ui.keyCode/

$(document).on('keydown', function(event) {
   if (event.key == "Escape") {
       alert('Esc key pressed.');
   }
});

언급URL : https://stackoverflow.com/questions/1160008/which-keycode-for-escape-key-with-jquery

반응형