엔터키를 쳤을 때 submit이 실행되는 현상

출처: https://rh-cp.tistory.com/65

현상 

: 검색 시 검색옵션이 제대로 구성되지 않으면 안내문 얼럿을 띄운 후 submit 되지 않도록 jsSubmit()이라는 자바스크립트 함수를 짰다. 

  검색어 입력란에서 엔터를 치면 jsSubmit()이 실행되도록 이벤트를 바인딩했다.

  jsSubmit() 함수 실행 시 검색옵션이 제대로 구성되지 않은 경우에는 안내문 얼럿이 뜨고, 다시 엔터를 치면 얼럿이 없어지고 submit은 일어나지 않는 것을 기대했다. 

  그런데 안내문 얼럿까지는 성공적으로 실행되는데 그 이후에 엔터를 치면 얼럿이 사라지는 대신 submit이 실행되었다. 

         

원인

: form 태그 내부에 input  태그가 1개만 존재할 때 엔터를 치면 submit이 실행된다고 한다.

 똑같은 자바스크립트 함수를 사용하는 다른 페이지에서는 같은 현상이 발생하지 않는 까닭은 다른 페이지에서는 검색옵션 입력란이 2개였던 것. 

  

해결방법

: 출처에서는 form 태그에 onsubmit="return false"를 하라고 하고, 

  다른 사이트에서는 input 태그를 하나 더 만들고 display:none 을 하라고 했는데...

  검색어 입력란에 엔터키를 쳤을 때에 jsSubmit()이 실행되도록 바인딩을 했는데 이 뒤에 event.preventDefault();를 넣어주면 된다.

** 더 알아보려면...

https://programmingsummaries.tistory.com/313

분명히 return false;를 해줬는데도 위 조건에서는 submit이 일어났다.

좀 더 살펴봐야 할 것 같다.