html 검색창 Enter키 동작하는 짧은 코드

웹사이트를 개발하면서 여러가지 코드를 접하고 만들고 하지만, 효율적으로 간략하게 표현할 수 있는 코드가 있다면

공유해 보고 싶어서 글을 적어봅니다.

보통 검색창을 만들어서 검색버튼을 누르거나 엔터키를 키면 작동하는 그런 루틴을 만들때...

 

와 같이 구성했다면,

검색내용을 입력 후 엔터키를 키면 작동하게 만드는 여러방법이 있겠지만, 가장 간단한 방법이 있어서 소개합니다.

기본적으로 

onKeyPress를 사용해서 제어한다면 자바스크립트의 function을 만들어서 사용할텐데.

한번에 바로 form.submit으로 하는 방법이 있었네요. 

<input type="text" id="search" name="search" style="height:30px;" value="<?=$search?>" onKeyPress="if (event.keyCode==13) { form.submit(); }" >

 

핵심코드는 

onKeyPress="if (event.keyCode==13) { form.submit(); }"
한방에 해결됩니다.

감사합니다.