728x90
728x90
onchange : Html의 요소가 바뀌었을 때 (텍스트입력칸 변경 등)
<select onchange="myFunction()">
<input type="text" name="txt" value="Hello" onchange="myFunction(this.value)">
onclick : 유저가 Html의 요소를 클릭했을 때
onmouseover : 유저가 마우스를 html 요소로 올렸을 때
onmouseout : 유저가 마우스를 html 요소 밖으로 옮겼을 때
onkeydown : 유저가 키보드 키를 눌렀을 때
<input type="text" onkeydown="myFunction()">
<element onkeydown="myScript">
object.onkeydown = function(){myScript};
object.addEventListener("keydown", myScript);
onload : 브라우저가 페이지의 로딩을 완료했을 때
JavaScript Events
JavaScript Events HTML events are "things" that happen to HTML elements. When JavaScript is used in HTML pages, JavaScript can "react" on these events. HTML Events An HTML event can be something the browser does, or something a user does. Here are some exa
www.w3schools.com
onkeyup : 값을 입력할 때마다 이벤트를 발생
- onkeyup , onmouseup = javascript용
- keyup , mouseup = jqeury용
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script src="http://code.jquery.com/jquery-3.1.0.min.js"></script>
<script>
function calc(val){
var origin = parseInt(val);
var interest = (20/100)*origin;
if(val == ""){
document.getElementById('result').value = "0";
}else{
document.getElementById('result').value = interest;
}
}
</script>
</head>
<body>
<div>원금 : <input type="text" id="origin" onkeyup="calc(this.value)"/></div>
<div>이자 : <input type="text" id="result" disabled/></div>
</body>
</html>
728x90
728x90
'Javascript' 카테고리의 다른 글
classList 메소드 (0) | 2020.03.25 |
---|---|
윈도우창의 크기 조절(자바스크립트 , 제이쿼리 방법) (1) | 2020.03.05 |
[공유] 게시판 댓글 테스트 (0) | 2020.02.18 |
XML DOM 의 Node Values 변경 (0) | 2020.02.17 |
[JS] 자바스크립트 HTML 태그 요소 동적 추가 및 삭제 (0) | 2020.02.11 |