반응형
jquery 사용
|
1
2
3
4
5
6
7
8
9
10
11
|
$('.form-control').on("keydown", function(e) {
var keyCode = e.keyCode;
console.log(e.keyCode);
if(keyCode === 39){ // Enter key
if($(this).parent().next().find('input').attr('name') === 'prdctAmt') {
$(this).parent().parent().next().find('input:eq(0)').focus();
} else {
$(this).parent().next().find('input').focus();
}
}
});
|
원하는 요소(ex. from=control 클래스를 가진 요소들) 에 keydown 이벤트 리스너를 추가
4번째 if -> keyCode 가 39번(방향키 ->) 인 경우를 찾는다
그 뒤로 8번째 줄에서 내가 이동하고 싶은 input으로 focust(); 를 주면 된다.
5번째 줄 if의 경우는 내가 사용하는 경우로 1라인의 input 이 끝나는 지점에서는 다음 라인의 input으로 이동하도록 구현해 놓은 코드
순수 javascript
|
1
2
3
4
5
6
7
8
9
10
|
var formControl = document.getElementsByClassName('form-control');
for(var i=0; i<formControl.length; i++) {
formControl[i].addEventListener('keydown', function(e){
var keyCode = e.keyCode;
console.log('pushed key ' + e.key);
if(keyCode == 39){ // Enter key
}
})
}
|
반응형
'IT > WEB' 카테고리의 다른 글
| 오늘의 코딩 2020-03-1 (0) | 2020.03.15 |
|---|---|
| [vue] vue 에서 페이지 랜더링시 checkbox 컨트롤하기 (0) | 2019.06.12 |
| [vue] vue 사용법 정리 (0) | 2019.05.20 |
| [javascript] formdata console 확인 방법 (0) | 2019.05.10 |
| [javascript] common js 리스트 (0) | 2019.01.23 |
