<form>태그 안의 <input type="text"> 엔터 입력 시 submit 막기

<form>
	<input type="text" id="textInput"></input>
</form>
<script>
</script>

위와 같은 코드가 작성되어 있을 때,

텍스트 인풋 영역에서 커서가 있는 상태에서 키보드 Enter를 치게 되면 submit이 일어나게 됩니다.

이를 방지하기 위한 간단한 방법을 두 가지 정리하겠습니다.

 

1.<form name="form" onsubmit="return false">

<form>태그 안에 onsubmit="return false"을 작성하여 submit 방지

 

 

2.Enter keydown 이벤트 사용하여 방지

document.addEventListener('keydown', function(event) {
  if (event.keyCode === 13) {
    event.preventDefault();
  };
}, true);