[jQuery] input enter key event (엔터키 이벤트, keypress)

input 창에 검색어를 입력 후 엔터키를 누르면 조회버튼이 클릭되는 소스입니다.
Data를 조회하기 위해 마우스 클릭 없이 간단하게 엔터키 만으로 조회할 수 있습니다.
반대로 엔터키 입력했을 경우 엔터 이벤트를 막기 위해서는 e.preventDefault(); 메서드를 통해서 이벤트를 처리하지
않으시면 됩니다.
간단한 소스이니 확인해서 사용하시면 됩니다.

 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
	$("#inp").keypress(function(e){
		//검색어 입력 후 엔터키 입력하면 조회버튼 클릭
		if(e.keyCode && e.keyCode == 13){
			$("#btn").trigger("click");
			return false;
		}
		//엔터키 막기
		if(e.keyCode && e.keyCode == 13){
			  e.preventDefault();	
		}
	});
	$("#btn").click(function(){
		alert("이벤트 감지");
	});
});
</script>
<input type="text" class="form-control input-sm" id="inp" name="inp">
<button type="button" class="btn btn-primary btn-sm" id="btn" name="btn">조회</button>

 

 

검색어 입력 후 엔터키 눌렀을때 이벤트