[javascript] 로그인 시 엔터키 적용

송창주·2022년 12월 27일
0

서비스 배포 후 사용자 피드백을 받았다.
그 중 로그인 로그인 버튼을 누르지 않고 엔터키로 로그인을 할 수 있게 적용해달라는 의견이 있었다.
그래서 엔터키를 활용한 로그인 방법을 찾아보았다.

1. 함수를 활용한 방법 (필자가 활용한 방법)

  • 엔터키 이벤트 함수 작성
function enterkey() {
  if (window.event.keyCode == 13) {

       // 엔터키가 눌렸을 때 실행할 내용
       handleSignin();
  }
}
  • onkeyup을 통해 사용할 인풋에 함수 적용
<input type="password" name="password1" id="signin-password1"
placeholder="비밀번호" onkeyup="enterkey()"/>

그 외 방법

1. keydown을 통한 방법

$('#signin-id1, #signin-password1').on('keydown', function(e){
	if (e.code == 'Enter'){
		$('.loginBtn').click()
	}
})

2. Jquery를 이용한 방법

$('#signin-id1, #signin-password1').keyup(function(e){if(e.keyCode == 13)  login(); });

위 두가지 방법을 처음 시도해봤지만 잘되진 않았다. 대부분의 글이 form 형태에서 submit으로 데이터를 보낼때 사용했으나 우리 조는 버튼 기능에 함수를 넣었기 때문에 함수를 활용한 방법이 적절했다.

0개의 댓글