etc

자동 Submit 방지 및 Enter Key 체크하기

by kay posted Aug 12, 2013
?

단축키

Prev이전 문서

Next다음 문서

ESC닫기

크게 작게 위로 아래로 댓글로 가기 인쇄

폼내에 input 객체가 하나뿐인 경우 엔터키를 입력하게 되면 자동으로 폼 Submit()이 되는데

어떤 경우에는 이것을 막아야 할 경우가 발생합니다..


이를 방지 하기 위한 방법입니다.


form 에서 onsubmit 에 return false; 값을 추가해 주고 

필요한 경우 keyup 되는 경우 키값에 따라 필요한 코딩을 추가해줍니다.


TEST Url : http://www.uhoon.co.kr/test/1907.html


<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>auto submit 방지 및 Key Code 체크하기</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script>
	$(function() {
		$("#name").on("keyup", function(e){

			$("#keyCode").html(e.which);

			if(e.which==13)
			{
				alert("enter Key");
			}
		});
	});
</script>
</head>
<body>
<form id="frm" onsubmit="return false;" >
	<input type="text" id="name" />
	<label for="code">Key Code : </label><span id="keyCode"></span>
</form>
</body>
</html>