728x90
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- 현재 작성하고 있는 파일은 UTF-8 DOS파일입니다.-->
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="ex_js_syntax">
<script type="text/javascript" language="javascript">
<!--
/* Form Events onfocus onblur onchange onsubmit
onsubmit은 생략 form에 이벤트 걸면 됩니다.(티스토리 소스 꼬임)
ex) form action="sub_form.php" onsubmit="sub_send()*/
function onfocus_event(){
/* onfocus 이벤트 */
alert("onfocus 실행되였어요");
}
function onblur_event(){
/* onblur 이벤트 */
alert("onblur 실행되였어요");
}
function onchange_event(){
/* onblur 이벤트 */
alert("onchange 실행되였어요");
}
//-->
</script>
<form name="input_type" id="input_type" method="post" >
<!-- 예제 박스에선 안됨 => form태그안에 form태그있으면 지워짐~ㅠ.ㅠ -->
<input type="text" value="포커스 얻을시 실행" onfocus="onfocus_event();">
<br />
<input type="text" value="포커스 잃을시 실행" onblur="onblur_event();">
<br />
<select name="atte_select_base" onchange="onchange_event();">
<option value="base">기본</option>
<option value="apple">사과</option>
<option value="orange">오렌지</option>
</select>
<br />
</form>
</div>
</body>
</html>
onfocus, onblur, onchange, onsubmit
onfocus- 포커스를 얻었을때 이벤트가 발생합니다.
onblur- 포커스를 잃었을때 이벤트가 발생합니다.
onchange- 교체(체인지)시 이벤트가 발생합니다.
onsubmit- 폼보낼시 이벤트가 발생합니다.(예제는 생략)
출처 : https://roydest.tistory.com/entry/form%EC%9D%B4%EB%B2%A4%ED%8A%B8-onfocus-onblur-onchange-onsubmit
728x90
'Javascript' 카테고리의 다른 글
keydown(), keyup() 이벤트 (0) | 2022.12.27 |
---|---|
getElementById() 대신 id.value (0) | 2022.12.22 |
const vs let (feat. 호이스팅) (2) | 2022.12.20 |
null,undefined,empty 체크 (0) | 2022.12.12 |
테이블에 행 추가하는 이벤트 (0) | 2022.11.16 |