반응형
HTML
<body>
<p>
<input type="text" name="user_id" id="user-id">s
</p>
</body>JQuery
익명 함수를 사용하기에는 키를 누르는 각각의 경우를 생각해야 하므로 함수의 이름을 붙여서 사용. 지금의 경우에는 한 곳이지만 여러 곳에서 사용할 수도 있기 때문
$(document).ready(function(){
$(document).on("keydown",keyEventFnc)
//key가 눌려지면, keyEventFnc 함수를 실행하겠다.
function keyEventFnc(e){//e, event - 발생한 이벤트 객체정보가 넘어온다.
//e.keyCode - 이벤트 객체 내부의 키코드 값
switch(e.keyCode){
case 37: //LEFT
$("#user-id").val("LEFT");
break;
case 38: //TOP
$("#user-id").val("TOP");
break;
case 39: //RIGHT
$("#user-id").val("RIGHT");
break;
case 40: //BOTTOM
$("#user-id").val("BOTTOM");
break;
}
}
});반응형
'JQuery' 카테고리의 다른 글
| Maze (0) | 2022.06.21 |
|---|---|
| Button Color Change (0) | 2022.06.17 |
| Basic (0) | 2022.06.17 |
| Password change (0) | 2022.06.17 |