jQuery를 사용하여 이스케이프 키의 키 코드
두 가지 기능이 있습니다. enter를 누르면 기능이 올바르게 실행되지만 escape를 누르면 작동하지 않습니다. 이스케이프 키의 정확한 숫자는 무엇입니까?
$(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).keyup(function(e) {
if (e.keyCode === 13) $('.save').click(); // enter
if (e.keyCode === 27) $('.cancel').click(); // esc
});
함수의 키 코드 값을 하드 코딩하는 대신 명명 된 상수를 사용하여 의미를보다 잘 전달하는 것이 좋습니다.
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.which
vs에 대한 논의가 있기 때문에 e.keyCode
: e.which
jquery-normalized 값이며 사용하는 것이 좋습니다.
event.which 속성은 event.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
실제 문자를 캡처하지 않으려면 사용 하지 마십시오 .
흥미롭게도 부트 스트랩은 드롭 다운 구성 요소에서 키 다운과 키 코드를 사용합니다 (3.0.2 현재)! 나는 그것이 아마도 좋지 않은 선택이라고 생각합니다.
JQuery 문서의 관련 스 니펫
브라우저는 서로 다른 속성을 사용하여이 정보를 저장하지만 jQuery는 .which 속성을 정규화하여 키 코드를 검색하는 데 안정적으로 사용할 수 있습니다. 이 코드는 화살표와 같은 특수 키 코드를 포함하여 키보드의 키에 해당합니다. 실제 텍스트 입력을 잡으려면 .keypress ()가 더 나은 선택 일 수 있습니다.
관심있는 다른 항목 : JavaScript Keypress Library
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;
}
코드가 정상적으로 작동합니다. 초점이 맞지 않은 창일 가능성이 높습니다. 비슷한 기능을 사용하여 iframe 상자 등을 닫습니다.
$(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);
}
모든 문자에 대한 16 진 코드를 얻으려면 http://asciitable.com/
다른 답변이없는 곳을 설명하기 위해; 문제는의 사용입니다 keypress
.
아마도 이벤트의 이름은 잘못 지정되었지만 keypress
when가 발생하도록 정의되어있을 수 있습니다. 즉 텍스트입니다. 당신이 원하는 것은 / 이며, 언제든지 (각각 또는 이전에) 실행 됩니다. 즉, 키보드에있는 것들입니다.when an actual
character
is being inserted
keydown
keyup
the user depresses a
key
차이점 esc
은 제어 문자 (문자 그대로 '비 인쇄 문자')이므로 텍스트를 쓰지 않으므로 실행조차하지 않기 때문에 여기에 나타납니다 keypress
.
enter
제어 문자 (예 : UI 제어)로 사용하더라도 여전히 개행 문자를 삽입하여 실행됩니다 keypress
.
출처 : quirksmode
나는 항상 키 업과 e. 이스케이프 키를 잡기 위해 사용했습니다.
나는이 질문이 jquery에 대해 묻는다는 것을 알고 있지만 jqueryui를 사용하는 사람들에게는 많은 키 코드에 대한 상수가 있습니다.
$.ui.keyCode.ESCAPE
http://api.jqueryui.com/jQuery.ui.keyCode/
e.keyCode
MDN에서 DEPRECATED로 간주 되는 것보다 업데이트 된 답변을 게시하기 만하면됩니다 .
오히려 e.key
모든 것을 위해 깨끗한 이름을 지원 하는 대신 선택해야 합니다. 관련 사본 파스타는 다음과 같습니다.
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);
키보드 입력 및 입력 된 키 조합을 캡처하기위한 강력한 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;
}
});
: 단축키는 다음과 같은 수식을 이해하고 ⇧, shiftoption⌥altctrlcontrolcommand하고 ⌘.
다음 특수 키는 바로 가기를 사용할 수 있습니다 : backspacetab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, delete과 f1를 통해 f19.
참고 URL : https://stackoverflow.com/questions/1160008/which-keycode-for-escape-key-with-jquery
'Programing' 카테고리의 다른 글
jQuery를 사용하여 입력에 초점이 있는지 테스트 (0) | 2020.02.10 |
---|---|
비어 있지 않은 디렉토리로 어떻게 복제합니까? (0) | 2020.02.10 |
Python : 어떤 OS를 실행하고 있습니까? (0) | 2020.02.10 |
JavaScript에서 연관 배열 / 해싱을 수행하는 방법 (0) | 2020.02.10 |
주어진 부분 이름으로 모든 프로세스를 종료하는 방법은 무엇입니까? (0) | 2020.02.10 |