본문 바로가기
Front/JavaScript & jQuery

input이 하나인 경우, enter키를 누르면 form submit 되는 현상 막기

by 은z 2023. 7. 18.

 

상황

form태그 안에 input 태그가 오직 하나인 경우 엔터를 치게 되면 기본적으로 submit이 된다.

의도하지 않은 submit을 막기 위한 방법은 여러가지가 있다.

그 중에 내가 사용한 방법을 정리해보려고 한다.

 

 


적용

 

📌form 태그에 onsubmit="return false;" 를 주어 submit을 막는다.

<form name="frm"  id="frm" method="post" action="/user/Board/comm_notice.do" onsubmit="return false;">
	<input type="hidden" name="temp1" id="temp1" value="temp1">
	<input type="hidden" name="temp2" id="temp2" value="temp2">
</form>

 

 

📌onkeyup에 엔터(keyCode == '13') 인 경우에 실행할 함수를 호출한다.

<input type="text" id="SCH_WORD" name="SCH_WORD" placeholder="검색어를 입력해 주세요." title="검색어" onkeyup="if(event.keyCode=='13'){event.preventDefault(); fnSearch();}">
<button type="button" onclick="javascript:fnSearch();">검색</button>

 

 

📌fnSearch() 함수 부분 : 이제 submit 속성을 true로 바꾸어준다.

function fnSearch(){
    $('#frm').attr("onsubmit", "return true");
    $('#frm').submit();
}

 

댓글