jquery 키보드 사용 소개 events_jquery-JS 튜토리얼-php.cn

jquery 키보드 사용 소개 events_jquery

WBOY

풀어 주다： 2016-05-16 18:00:00

원래의

1047명이 탐색했습니다.

1. 먼저 알아야 할 사항은 다음과 같습니다.
1.keydown()
keydown 이벤트는 키보드를 눌렀을 때 발생합니다.
2.
keyup 키를 놓았을 때 이벤트가 발생합니다. 즉, 키보드를 눌렀다가 들어올린 후 이벤트가 발생합니다.
3. keypress()
키를 눌렀을 때 keypress 이벤트가 발생합니다. 동일한 Press 키를 눌렀다가 떼는 것으로 이해할 수 있습니다.
2. 키보드에서 해당 ASCII 코드를 얻습니다.

복사 코드 코드는 다음과 같습니다.

 
$(document).keydown(function(event){ 
console.log(event.keyCode); 
}); 

$tips: 위의 예에서 event.keyCode는 키보드에서 어떤 키를 눌렀는지 알아내는 데 도움이 됩니다. 위, 아래 등의 ASCII 코드를 반환합니다. , 왼쪽 및 오른쪽 키는 각각 38, 40, 37, 39입니다.
3. 예(키보드의 왼쪽 및 오른쪽 키를 누를 때)

코드 복사 코드는 다음과 같습니다.

 
$(document).keydown(function(event){ 
//Judge event.keyCode가 37(즉, 왼쪽 키)인 경우 to_left() 함수를 실행합니다. 
/ /event.keyCode가 39(즉, 오른쪽 키)인 경우 to_right() 함수를 실행합니다. 
if( event.keyCode == 37){ 
//뭔가를 하세요; 
}else if ( event.keyCode == 39){ 
//뭔가를 하세요; 
} 
}); 🎜>
 

사례 연구:
예: 소설 웹사이트에서는 이전 기사와 다음 기사를 보려면 왼쪽과 오른쪽 키를 누르는 것이 일반적입니다. 양식 제출을 구현하려면 Google 리더 및 Youdao Reading에서 모든 단축키 작업을 수행하세요... (사용자 환경을 개선하기 위해) ctrl Enter를 구현하려면 Ctrl Enter를 눌러 양식을 제출해야 합니다.

코드 복사 코드는 다음과 같습니다.

$(document).keypress(function(e) { 
if (e.ctrlKey && e.which == 13) 
$("form").submit() 
}) 
//키보드 조작
$(document) .keydown(function(event){ 
var e = event || window.event; 
var k = e.keyCode || e .which; 
switch(k) { 
case 37: 
//… 
break; 
case 39: 
//… 
break 
} 
return false; 🎜>이벤트에 대한 자세한 요약 및 설명: 
http://www.jb51.net/article/28772.htm
 

w3school의 jQuery 이벤트 참조 매뉴얼
학습 과정에서 상호작용성과 사용자 경험을 개선하는 방법에 대해 더 많이 생각해야 합니다.