javascript input 엔터쳤는데 자동 submit 되는 경우 해결

input 태그에서 엔터를 누를 경우 Form안에 있다면, 의도하지않게 submit이 자동으로 일어날 수 있다.

처음에는 왜 submit 되는지 자체를 모를 수도 있다.

암튼, input에서 엔터를 치거나 button이 form 안에 있으면 설정을해주지않으면 자동으로 submit이 되게되어있는데, 이걸 막는 방법은 몇 가지가 있다.

​

​

​

​

​

​

1. input 태그 앞에 hidden input 놓기

자주쓰는 꼼수들(?)중 하나..

​

수정 전)

 

<form id="deerForm">
    <input type="text" name="deerText"/> <!-- 엔터 칠 input -->
</form>

 

 

수정 후)

 

<form id="deerForm">
    <input type="hidden"/>
    <input type="text" name="deerText"/> <!-- 엔터 칠 input -->
</form>
​

 

 

2. 기본적으로 input에 엔터 치면 submit 막기. 이건 모든 input에 해당

 

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

 

 

 

3. jquery 써서 input 태그만 막기

 

$('input[type="text"]').keydown(function() {
  if (event.keyCode === 13) {
    event.preventDefault();
  };
});